Jump to content
Kennerd

How to get a png to behave like glyph in Designer

Recommended Posts

Hey there-

I'm new to Affinity products.  I'm working on a mock-up for a mobile app.  In Designer, I've grabbed some of the glyphs from the asset manager for the navigation bar at the bottom of the phone display.  I needed an image that wasn't in the asset manager so I found something that worked for me from elsewhere.  The image file is a png.

Now, I'm trying to figure out how to make it function like the included glyphs do.  For instance, while trying out different color schemes - with the glyphs - I just have to select the glyph and then choose a color.  That's not working with the png file.

Is there a way to convert the png to the same file type as the glyph so it will behave like one?

Thanks

Share this post


Link to post
Share on other sites

Well the PNG is a bitmap/raster image and thus treated slightly different for coloring here. In case the PNG image is all hold in a single color then you can use the color fill can tool () in the pixel persona to recolor it. Or alternatively you can trace and thus convert the PNG bitmap into a vector drawing with the help of some third party bitmap-to-vector tracing tool. The later (traced into a vector draw) would allow to set/change the color as you did with the glyphs.

Some online tracing/vectorization tools are:

A free app which contains a very capable Potrace based bitmap to vector tracer is InkScape.


☛ Affinity Designer 1.9.1 ◆ Affinity Photo 1.9.1 ◆ OSX El Capitan

Share this post


Link to post
Share on other sites

Thanks for the help.  I'll check into your suggestions.  One thing I've run into when trying to change the color of the png in Photo using the Color Overlay FX... the image gets a bit of a hue, but doesn't actually change to the color I've selected.  Must be a setting somewhere that I'm missing.

Share this post


Link to post
Share on other sites

Well FX Color Overlay works mostly for vectors/shapes and not for bitmaps/images. - Here is how to change the color for a bitmap image (PNG) via Designer and it's Pixel persona. Note that in this short example a PNG bitmap file is opened and that the Layers panel indicates the layer as a (pixel) layer.

 

 


☛ Affinity Designer 1.9.1 ◆ Affinity Photo 1.9.1 ◆ OSX El Capitan

Share this post


Link to post
Share on other sites
8 hours ago, v_kyr said:

Note that in this short example a PNG bitmap file is opened and that the Layers panel indicates the layer as a (pixel) layer.

Alternatively, if working with a Placed png file one would have an (Image) layer. At that point, with the layer selected, changing its Fill will change its color. That can be done from the Context Toolbar, or the Color panel, the Appearance panel, etc.


-- Walt

Windows 10 Home, version 2004 (19041.388),
   Desktop: 16GB memory, Intel Core i7-6700K @ 4.00GHz, GeForce GTX 970
   Laptop:  8GB memory, Intel Core i7-3625QM @ 2.30GHz, Intel HD Graphics 4000 or NVIDIA GeForce GT 630M
Affinity Photo 1.9.1.979 and 1.9.2.997 Beta   / Affinity Designer 1.9.1.979 and 1.9.2.997 Beta  / Affinity Publisher 1.9.1.979 and 1.9.1.979 Beta

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...

Important Information

Please note there is currently a delay in replying to some post. See pinned thread in the Questions forum. These are the Terms of Use you will be asked to agree to if you join the forum. | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.