Recent

Author Topic: Glyph fails to render on SpeedButton  (Read 373 times)

Porbitz

  • New Member
  • *
  • Posts: 10
Glyph fails to render on SpeedButton
« on: August 14, 2019, 11:45:51 am »
Hi All,

For some reason, the glyph I assigned to a SpeedButton fails to render correctly when I compile a project. The button is set to be flat and transparent; and the glyph is a png with an alpha channel to make the background transparent. Please see the attachments that show how it looks during the design and how it does on runtime, and the image I'm using.

Any idea why it happens and how can I fix it? I haven't been able to find the answer on forums or google searches.

Many thanks for your time and advice!

lainz

  • Hero Member
  • *****
  • Posts: 3226
    • Lainz
Re: Glyph fails to render on SpeedButton
« Reply #1 on: August 14, 2019, 06:09:37 pm »
It's a bug regards PNG format reader. I had the same problem with a black and transparent image.

winni

  • Sr. Member
  • ****
  • Posts: 336
Re: Glyph fails to render on SpeedButton
« Reply #2 on: August 14, 2019, 06:32:32 pm »
Hi!

Yes, I can confirm this bug.

Workaround:

* Dont assign a Glyph in design time
* Speed.Glyph := TBitmap.create;
* Speed.Glyph.setsize (MyWidth, MyHeight);
* Load the Bitmap into the glyph     OR
* copy the bitmap from somewhere like an Imagelist

Took some time until I found it!


Winni
« Last Edit: August 14, 2019, 06:35:18 pm by winni »

wp

  • Hero Member
  • *****
  • Posts: 6234
Re: Glyph fails to render on SpeedButton
« Reply #3 on: August 14, 2019, 06:44:39 pm »
If you have Laz 2.0+ you can use the new Images and ImageIndex properties of the TSpeedButton and TBitBtn: Load the image into an imagelist, assign that to the Images property and set the ImageIndex accordingly. Don't use the Glyph property. The imagelist approach has the advantage that the image is high-dpi aware because the imagelist of Laz2.0+ supports several image sizes and can adjust the size to the screen resolution.

Doing this I found that the image paints correctly.
Lazarus trunk / fpc 3.0.4 / all 32-bit on Win-10

wp

  • Hero Member
  • *****
  • Posts: 6234
Re: Glyph fails to render on SpeedButton
« Reply #4 on: August 15, 2019, 12:34:30 am »
Another observation: I loaded the problematic image into an image list where it is displayed correctly. I used the image list editor to save it back to a different file. After loading this image into the Glyph of a speed button the error disappears.

Both images differ in the color depth of the pixels: while the original image has 16 bits per pixel the re-saved image has 32 bits per pixel. Looking at the lfm file it can be seen that the image data section for the original image is about half the size of the re-saved image.

From this, I'd conclude that TSpeedButton and TBitBtn probably write the 16bit image to the lfm file, while the ImageList makes a conversion to 32bit. Since the 16bit image in the lfm file is not displayed correctly the conclusion could be that the png writer has an issue with the 16bit pixel format. But: When I load the problematic image into an TPortableNetworkGraphic and save it immediately back to file the result is a 16bit per pixel image again which is identical with the original image. And this image can be read without issues.

So, in total, I suspect that streaming to the lfm file cannot handle the 16bit-per-pixel png image correctly.

« Last Edit: August 15, 2019, 12:52:06 am by wp »
Lazarus trunk / fpc 3.0.4 / all 32-bit on Win-10

winni

  • Sr. Member
  • ****
  • Posts: 336
Re: Glyph fails to render on SpeedButton
« Reply #5 on: August 15, 2019, 01:44:39 am »
Hi!

Sounds as if it is a trace to solve the problem.

But the problem isn't consistent. Sometimes you can really use a glyph as it should be. Another time in the beginning everything looks good. After an hour working on other components and code the glyph is suddenly corrupted. Because of saving the project inbetween?? And other times the glyph suddenly had vertical stripes - and the glyph with lime background turned to lime-green-lime-green ... stripes.

That were the points when I started to develop my workaround.

Winni

« Last Edit: August 15, 2019, 01:46:12 am by winni »

Porbitz

  • New Member
  • *
  • Posts: 10
Re: Glyph fails to render on SpeedButton
« Reply #6 on: August 15, 2019, 12:59:54 pm »
Hi All,

Thank you very much for the prompt and comprehensive responses.

The Imagelist trick worked like a charm (see screenshots)! Thinking of it, it's also a great way to compartmentalize and manage the icons for all the buttons.

Kind regards,

wp

  • Hero Member
  • *****
  • Posts: 6234
Re: Glyph fails to render on SpeedButton
« Reply #7 on: August 15, 2019, 01:23:22 pm »
But the problem isn't consistent. Sometimes you can really use a glyph as it should be. Another time in the beginning everything looks good. After an hour working on other components and code the glyph is suddenly corrupted. Because of saving the project inbetween?? And other times the glyph suddenly had vertical stripes - and the glyph with lime background turned to lime-green-lime-green ... stripes.
I have never seen this. Returning to the idea with the 16-bit-per-pixel images: Are the images affected 16bit images too? To check load the image into IrfanView or some other picture viewer - there is a menu item for "image properties", "image information" or similar. Or write this little code:

Code: Pascal  [Select]
  1. uses
  2.   TypInfo;
  3.  
  4. procedure TForm1.CheckPixelFormat(AFileName: String);
  5. var
  6.   png: TPortableNetworkGraphic;
  7. begin
  8.   png := TPortableNetworkGraphic.Create;
  9.   try
  10.     png.LoadFromFile(AFileName);
  11.     Caption := GetEnumName(TypeInfo(TPixelFormat), integer(png.PixelFormat));  // --> display pixel format in form caption
  12.   finally
  13.     png.Free;
  14.   end;
  15. end;
Lazarus trunk / fpc 3.0.4 / all 32-bit on Win-10