[SOLVED] TBitBtn shows some glyphs, but not all

[pleumann]

Hi,

this is my first attempt at a Lazarus application, so please bear with me. I have some Delphi experience, but that must have been more than 25 years ago. I am trying nothing fancy. Just a simple application with some forms and standard elements. I develop on MacOS Monterey (x86) with Lazarus 2.2.6 and FPC 3.2.2.

I use TBitBtn with glyphs downloaded from https://fonts.google.com/icons as transparent 72x72 PNG. I noticed most glyphs will be displayed correctly at runtime, but not all. Some buttons stay empty. Strangely, they are all fine in the designer. Not sure what other info I can provide. I attached two of the PNGs I use. Gaming is ok, settings is not.

Cheers,
Joerg

[Blaazen]

There is AFAIK a feature (because of Delphi compatibility) - top left pixel is used for transparecy. Try to look what images cause problem, if it is that case.

[pleumann]

The images are PNGs and have real transparency, so there should be no need to convert a color. All images have a transparent border several pixels wide. That "magic" pixel is surely a transparent one already. Also, they're displayed correctly in the designer/IDE.

But you may be onto something: If I give the PNGs an explicit background color they are suddenly displayed at runtime, too. Just ugly especially with focus), because all the nice anti-aliasing in the original PNGs gets lost. So it could have something to do with the content of the PNGs.

[pleumann]

I experimented a bit more and created a new, empty 72x72 image in GIMP, then pasted the transparent original image onto that. Guess what - it works now. So there is something in some of the original PNGs that Lazarus doesn't like or gets confused by. Which is funny because they all come from the same source and share a common format. One would expect them to behave in an identical way, too. And there's still the interesting detail that the IDE shows all glyphs properly.

Anyway: Workaround found. Thanks for the pointer!

[Blaazen]

The images are PNGs and have real transparency, so there should be no need to convert a color.

I don't know how it is done internally. Glyph is TBitmap so there may be a conversion from PNG to something else.

You can also try to feed images to ImageList and assign ImageList property to each BitBtn and set its ImageIndex. There is some control over transparency in ImageList editor (you can specify transparency color).

[tetrastes]

Also, they're displayed correctly in the designer/IDE.

At Ubuntu 22.04 Lazarus 2.2.6 outline_settings_black_36dp.png is not displayed nor in the designer, nor at runtime. But in TImage it is displayed correctly.

So it could have something to do with the content of the PNGs.

$ file outline_settings_black_36dp.png
outline_settings_black_36dp.png: PNG image data, 72 x 72, 8-bit gray+alpha, non-interlaced

$ file outline_sports_esports_black_36dp.png
outline_sports_esports_black_36dp.png: PNG image data, 72 x 72, 8-bit/color RGBA, non-interlaced

[pleumann]

At Ubuntu 22.04 Lazarus 2.2.6 outline_settings_black_36dp.png is not displayed nor in the designer, nor at runtime. But in TImage it is displayed correctly.

That's funny. It's definitely different here.

$ file outline_settings_black_36dp.png
outline_settings_black_36dp.png: PNG image data, 72 x 72, 8-bit gray+alpha, non-interlaced

$ file outline_sports_esports_black_36dp.png
outline_sports_esports_black_36dp.png: PNG image data, 72 x 72, 8-bit/color RGBA, non-interlaced

You hit the nail here! All those that have "gray+alpha" are not displayed at runtime, the "color RGBA" ones are fine. The new image I created used "color RGBA" too. I checked the whole download now. It's a total mix of those formats, which I would not have expected given that all files are from the same source, but maybe the (surely automated) conversion process chose the color format based on whichever resulted in the smaller file.

Anyway, thanks a lot for your help, guys!

[jamie]

There is AFAIK a feature (because of Delphi compatibility) - top left pixel is used for transparecy. Try to look what images cause problem, if it is that case.

I remember it as the bottom left pixel.

[pleumann]

That's what the Delphi docs say, too:

Note: The lower left pixel of the bitmap is reserved for the "transparent" color. Any pixel in the bitmap which matches that lower left pixel will be transparent.