Recent

Author Topic: [SOLVED] Transparent TBGRABitmap copied/assigned to TImage loses transparency  (Read 1192 times)

r.lukasiak

  • Full Member
  • ***
  • Posts: 138
Hi everyone!

I need a semi-transparent dynamically generated image, I create it on TBGRABitmap but when I assign it to TImage, the Image has a black background.
Googling led me to this post https://forum.lazarus.freepascal.org/index.php/topic,55300.msg411319.html#msg411319. According to the author, the solution worked but in my case it didn't. I tested it on QT5 (Linux) and Windows, in both cases exactly the same result.

Code: Pascal  [Select][+][-]
  1. var
  2.   bubble: Timage;
  3.   bmp: TBGRABitmap;
  4.   TBit: TBitmap;
  5.   cc: integer;
  6. begin
  7.   cc:=ChatsTab.ControlCount;
  8.   bubble:=Timage.Create(Self);
  9.   bubble.Parent:=ChatsTab;
  10.   bubble.Width:=ChatTab.ClientWidth div 2;
  11.   bubble.Height:=60;
  12.   bubble.Left:=(ChatsTab.ClientWidth-bubble.Width) div 2;
  13.   bubble.top:=10+cc*60;
  14.   bubble.Picture.Bitmap.MaskHandle:=0;              
  15.   bubble.Picture.Bitmap.Transparent := True;
  16.   bubble.Picture.Bitmap.TransparentColor := $000000;
  17.  
  18.   TBit := TBitmap.Create;
  19.   TBit.PixelFormat := pf24bit;
  20.   TBit.Width := bubble.Width;
  21.   TBit.Height := bubble.Height;
  22.  
  23.   bmp:=TBGRABitmap.Create(bubble.Width,bubble.Height,BGRA(0,0,0,0));
  24.   bmp.draw(TBit.Canvas, 0,0,true);
  25.   bmp.RoundRect(10,10,bubble.Width-10,bubble.Height-10,15,15,$00FF9900,BGRA(128,128,128,255),dmDrawWithTransparency,8192);
  26.  
  27.   bubble.picture.Assign(bmp);
  28.  

Any clue?

As a matter of fact I don't need specifically TImage, I need any way to display what I create on TBGRABitmap. Maybe someone can recommend any other component?

thanks in advance!
« Last Edit: June 03, 2022, 06:20:57 pm by r.lukasiak »

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
Re: Transparent TBGRABitmap copied/assigned to TImage loses transparency
« Reply #1 on: June 03, 2022, 07:31:22 am »
Hi!

To be sure to have transparency, I suggest to use TBGRAGraphicControl of BGRAControls. In the redraw event, draw the content as you like using the Bitmap: TBGRABitmap parameter.

It also takes into account Retina scaling on MacOS (with BitmapAutoscale property).
Conscience is the debugger of the mind

r.lukasiak

  • Full Member
  • ***
  • Posts: 138
Re: Transparent TBGRABitmap copied/assigned to TImage loses transparency
« Reply #2 on: June 03, 2022, 06:20:38 pm »
thank you very much for you answer.
I'd tried TBGRAGraphicControl but I can't get it to work, I don't know what I'm doing wrong. Anyway it requires painting OnRedraw which would complicate my code a little bit.
I've just found TBDRoundedImage, it works as needed, I just needed to switch rounding off.I just create it dynamically, draw what I need using TBGRABitmap and assign it to TBDRoundedImage as I tried with TImage.

thanks!

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
I understand you're used to draw outside of the OnPaint event. Though in this case, I don't really see why this would be complicated. You can store some info on how to draw things in variables for example. Maybe you can find some help on how to do that.

But of course you're free to find the way it suits you.

Conscience is the debugger of the mind

r.lukasiak

  • Full Member
  • ***
  • Posts: 138
well, I'm used to drawing in OnDraw but in my current case it'd be more difficult, every Image depends on some external data and they are created dynamically
And I didn't actually figure out how to draw on TBGRAGraphicControl, I tried a couple of days ago and then again today (after you mentioned it) but I didn't succeed. Maybe some sample code or some instructions? I'd really appreciate it.

thx

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
One approach would be to create a TBGRABitmap at the beginning (when the form is created for example). Then each time you need to draw, you draw in this bitmap. And in the OnRedraw event of TBGRAGraphicControl copy the bitmap.
Code: Pascal  [Select][+][-]
  1. procedure TForm1.FormCreate(Sender: TObject);
  2. begin
  3.   myBuffer := TBGRABitmap.Create(BGRAGraphicControl1.Width, BGRAGraphicControl1.Height);
  4. end;
  5.  
  6. procedure TForm1.FormDestroy(Sender: TObject);
  7. begin
  8.   myBuffer.Free;
  9. end;
  10.  
  11. procedure TForm1.BGRAGraphicControl1Redraw(Sender: TObject; Bitmap: TBGRABitmap);
  12. begin
  13.   Bitmap.PutImage(0, 0, myBuffer, dmSet);
  14. end;
  15.  
  16. procedure TForm1.BGRAGraphicControl1MouseDown(Sender: TObject;
  17.   Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
  18. begin
  19.   myBuffer.FillEllipseAntialias(X, Y, 6, 6, clWindowText);
  20.   BGRAGraphicControl1.DiscardBitmap;
  21. end;
myBuffer is a variable declared in the class(TForm).

If the BGRAGraphicControl1 size changes, you need to determine how to change the size of myBuffer or if you want to stretch it when you draw it.
Conscience is the debugger of the mind

r.lukasiak

  • Full Member
  • ***
  • Posts: 138
thank you very much! it works perfectly. I will use this approach, the RoundedImage is, for some reason, generating garbage when I use .TextOut function (I will create a separate post on it, it seems to be a bug).

once again, thanks for the example!

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
You're welcome.  :)

Sure, feel free to make a post if there is another issue or question.
Conscience is the debugger of the mind

 

TinyPortal © 2005-2018