SOLVED: Black image on convert a PNG 32bit to 24bit
lazarus / 39-Graphics

----------------------------------------------------------------------
AsleyCruz · 2020-03-27 17:46

Hi coders, I would like to convert a PNG image 32bit (with
transparency) to 24/16 bits
but the whole image is black. See attached image...

Can you help me please?

Thanks a lot.

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i var  aPng:
TPortableNetworkGraphic;begin  aPng :=
TPortableNetworkGraphic.Create;  aPng.Assign(Image1.Picture.PNG); 
aPng.PixelFormat := pf24bit;  aPng.Transparent := True; 
aPng.SaveToFile('zzz.png');end;

----------------------------------------------------------------------
wp · 2020-03-27 18:12

Move the aPng.Assign after setting the Pixelformat. In my tests with
one of the Lazarus palette images, it is not necessary to set
Transparent.

----------------------------------------------------------------------
AsleyCruz · 2020-03-27 18:32

Quote from: wp on March 27, 2020, 07:12:27 pmMove the aPng.Assign
after setting the Pixelformat. In my tests with one of the Lazarus
palette images, it is not necessary to set Transparent.

Hi wp
I did the changes but it saves the image ok but in 32bit, not in
24bit.
Any working function that you have used before?

Thanks

----------------------------------------------------------------------
wp · 2020-03-27 20:52

Sorry, I did not check the PixelFormat... Assign seems to copy the
PixelFormat as well. As an alternative you can paint the pf32bit image
on the pf24bit canvas of the destination png.

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i procedure
TForm1.Button1Click(Sender: TObject);var  png:
TPortableNetworkGraphic;begin  png := TPortableNetworkGraphic.Create; 
try    png.PixelFormat := pf24bit;   
png.SetSize(Image1.Picture.Width, Image1.Picture.Height);   
png.Canvas.Brush.Color := clWhite;    png.Canvas.FillRect(0, 0,
png.Width, png.Height);    png.Canvas.Draw(0, 0, Image1.Picture.Png); 
  png.SaveToFile('zzz.png');  finally    png.Free;  end;end;

----------------------------------------------------------------------
AsleyCruz · 2020-03-27 22:47

Quote from: wp on March 27, 2020, 09:52:35 pmSorry, I did not check
the PixelFormat... Assign seems to copy the PixelFormat as well. As an
alternative you can paint the pf32bit image on the pf24bit canvas of
the destination png.

Hi wp, the png file does not have transparency and tried to save in
pf16bit format
but it is still pf24bit. Anyway, thanks four your time.

----------------------------------------------------------------------
winni · 2020-03-27 22:57

Hi!

You forgot the TransparentColor:

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i
aPNG.TransparentColor := clFuchsia;
Winni

----------------------------------------------------------------------
winni · 2020-03-27 23:30

Hi!

No, it was not the TransparentColor.

It was again the roulette with the Canvas.draw.
You'll never know if it's black or white.

I prefer canvas.copyRect:

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i var R :
TRect;... //png.Canvas.Draw(0, 0, Image1.Picture.Png); // no no noR :=
Rect(0,0,Image1.Width,
Image1.Height);Image1.Canvas.CopyRect(R,png.Canvas,R);   
Then everything works fine.

Winni

----------------------------------------------------------------------
flowCRANE · 2020-03-28 00:55

@AsleyCruz: IMO you cannot do this with standard classes like
TPortableNetworkGraphic. I have a very simillar problem, but I wanted
to render the two-colored image and store it as 4bpp windows bitmap. I
made it by using TFPMemoryImage — full solution to my problem is in
this post of my thread.

If you want to export image to 24bpp PNG, use example from @wp.

----------------------------------------------------------------------
lainz · 2020-03-28 00:58

Check out LazPaint code, in the save dialog there's an option to save
256 colors and also 24 bit.

----------------------------------------------------------------------
flowCRANE · 2020-03-28 01:10

Fun fact — PNG does not support 16bpp for colored images, so only
24bpp remains.

----------------------------------------------------------------------
winni · 2020-03-28 01:14

Hi AsleyCruz

Since I know the BGRA library I dont have to fool around with
transparency of bitmap or png which causes often trouble.

Transparency is so easy to handle with BGRA and you dont have to care
about 16/24 or 32 bit

One trick in my  example is the use of the "magicWhite" .
It contains the RGB values for white 255/255/255.
But it has an alpha value of zero, so it is complete transparent.
And this value can be changed very simple so the transparent pixels
turn tp white.


Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i procedure
TForm1.SpeedButton1Click(Sender: TObject);var tmp: TBGRAbitmap;   
magicWhite : TBGRAPixel;begin Image1.Canvas.Brush.color :=
clYellow; Image1.Canvas.FillRect(0,0,Image1.Width, Image1.Height);  
MagicWhite :=BGRA(255,255,255,0);  tmp := TBGRAbitmap.Create
(Image1.width,Image1.Height, MagicWhite); 
Tmp.FillEllipseAntialias(100,100,30,30,cssRed); 
tmp.Draw(Image1.Canvas,0,0,false);  image1.Refresh;  ShowMessage
('That was transparent'+LineEnding+'Now opaque'); 
tmp.AlphaFill(255,0,tmp.NbPixels); 
tmp.Draw(Image1.Canvas,0,0,false);  image1.Refresh; 
tmp.SaveToFile('Something.png');  tmp.free;end;                      
           
Winni