We are about to switch to a new forum software. Until then we have removed the registration on this forum.
I am curious what the best strategy is for making an image have a transparent background. How would I go about doing this? Alpha masks? I've tried to get the .gif to have no background by doing the magic want layer separation in photoshop, then saving the .gif for web. This has not worked...
Answers
Dunno much, sorry! I know that ".png" format is the most appropriate for alpha properties.
Anyways, if you know which is the background color value you wanna make transparent,
use method loadPixels() from that PImage object, iterate over that pixels[], checking all the time for that color.
Every time it's found it, apply an
&
mask to it such as this 1 ->final color MASK = 0xFFFFFF;
, and reassign it back.As said, better use PNG format rather than the old, outdated Gif one. PNG allows to have more colors, has better compression overall and supports several levels of transparency.
In Photoshop, you need to enable the alpha layer, and to use the eraser to remove the parts where the background must be transparent.
Note: why is this topic in the Android category? Is it on purpose? Because the question / answer are system agnostic.
@ gotoloop
I have a question to your answer:
You wrote:
So the pixel is transparent then? Do I say for making black transparent e.g.
?
And I do it only once for all images, so I can do it in setup() ?
(or even write a help program to do this and just write them back to hard drive with transparency?)
Let's say I want to make a puzzle piece. Like this
http://de.freepik.com/vektoren-kostenlos/jigsaw-blue-puzzle-clip-art_385673.htm
I make all parts black that are to be transparent with program paint or so and save them separately (because I don't have photoshop).
When I loop over all pixels... how can I make sure it's not a black pixel right in the middle of the puzzle piece but a pixel that really must be transparent?
Thanks!
Greetings, Chrisir
@Chrisir: Of course I don't know how GoToLoop would handle it, but I would do the following:
Load it's pixels array and loop over every pixel, with the following code:
for(int n = 0; n < someImage.pixels.lenght; n++) if(someImage.pixels[n] == maskColor) someImage.pixels[n] = 0;
maskColor is the color value that should get transparent, #ff00ff for example.
0 or 0x00000000 is not only black it's black and fully transparent.
ok, thanks a ton
but when you have an image / puzzle like this:
http://4.bp.blogspot.com/_wkxbqC2YoYw/TPhWgLbxYFI/AAAAAAAAAXM/EC7SkrFGfqA/s1600/nice-kids-puzzle-piece-788190.png
it seems to be a lot of work just to prepare the pieces of the puzzle, right?
and... . how can I make sure it's not a black pixel right in the middle of the puzzle piece but a pixel that really must be transparent?
Just fill the pixels that should be transparent with some arbitrary "mask" color, dark green for example, like in this picture: http://www.rpg-maker.fr/dl/monos/article/rm2003/hero1.png
If you are not sure if your chosen mask color is already present in your image, just use an secondary greyscale image as alpha channel. Example: http://www.thebest3d.com/carrara/digarts/07-Alpha2Swap.jpg
Edit: A quick example: