Custom shaped form [SOLVED] lazarus / 39-Graphics ---------------------------------------------------------------------- G90210 · 2017-01-24 22:34 Hello, I am trying to create a custom shaped form (widget) which should work with both Windows and OS X. I have tried to achieve this by creating a form with one image, mask image (see g6822-200-mask.bmp), and setting form shape to the mask image. This should do the work, however: a)   Black line is displayed on the top of the image. For some reason, it is not visible in the screenshot. This line disappears, after I re- paint the form e.g. minimize and re-open it (see display1.png and see display2.png). b)   Some part of the image (paper clip) is pixelated - this is especially seen on the black background (see display3.png) This is the code which I am using: 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.FormPaint(Sender: TObject);var  aPic: TPicture;begin   aPic:=TPicture.Create;  aPic.LoadFromFile('g6822-200-mask.bmp');  aPic.Bitmap.Monochrome:=True;  //aPic.SaveToFile('test.png');  Width:=aPic.Width;  Height:=aPic.Height;  SetShape(aPic.Bitmap);  aPic.Free;  Form1.OnPaint:=nil;end;                 Is this even the right way to do this? Maybe instead of using .png image I should be using .svg or maybe even draw the same picture with the code? I believe this is not a very unique question, however I was not able to find the response on this forum Windows 10, 64bit, version 1.6.2, SVN revision 53354 P.S. I was doing some programming using pascal and Delphi when I was at school and university a while ago, and now I am very glad that there is such tool for my hobby programming. Thanks ---------------------------------------------------------------------- howardpc · 2017-01-24 22:51 Perhaps http://wiki.lazarus.freepascal.org/LCL_Tips#Creating_a_non- rectangular_window_or_control can help. ---------------------------------------------------------------------- G90210 · 2017-01-25 21:39 Thanks for the quick reply. I am currently struggling with assigning bitmap to TRegion or HRGN, but per this link "One can also call the LCLIntf routine SetWindowRgn, which is completely equivalent to calling the SetShape method." Since I will still be using the same bitmap mask, do you think it is still worth trying further? Also, I have found some really nice widgets which are created with Cross Codebot (https://www.getlazarus.org/forums/viewtopic.php?f=18&t=40), but I am not able to access that forum, so I am not sure if it is still available. Maybe there are some other options/components how could this could be done using vector graphics? ---------------------------------------------------------------------- minesadorada · 2017-01-25 21:58 I'm interested in this thread, since my PoweredBy component stopped showing a transparent form after Laz V1.6.  On my ToDo list to fix for Laz 1.6+ ---------------------------------------------------------------------- balazsszekely · 2017-01-26 05:28 The attached project is a windows only solution, however with a little effort you can make it cross platform. All you have to do is search for Linux/OSX equivalent of the functions used. It works by making the form transparent, I mainly used in the past for splash screens. ---------------------------------------------------------------------- jwdietrich · 2017-01-26 05:53 Quote from: GetMem on January 26, 2017, 06:28:03 amAll you have to do is search for Linux/OSX equivalent of the functions used. This is the hard part... ---------------------------------------------------------------------- G90210 · 2017-01-26 22:48 Thanks GetMem this one looks really nice. I especially enjoyed the bunny picture. Maybe there are samples with vector graphics? I would like to see how those looks like. Quote from: GetMem on January 26, 2017, 06:28:03 amThe attached project is a windows only solution, however with a little effort you can make it cross platform. All you have to do is search for Linux/OSX equivalent of the functions used. It works by making the form transparent, I mainly used in the past for splash screens. ---------------------------------------------------------------------- User137 · 2017-01-27 01:50 I edited just minor things for clarity, and to see them all in code so you don't have to download forms. Using slightly less code to make form movable. 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 uses JwaWindows, ... other units; interface type  TForm1 = class(TForm)    Image1: TImage;    procedure FormCreate(Sender: TObject);    procedure FormKeyDown(Sender: TObject; var Key: Word; Shift: TShiftState);    procedure Image1MouseDown(Sender: TObject; Button: TMouseButton;      Shift: TShiftState; X, Y: Integer);    procedure Image1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer    );  private    mx, my: integer;    procedure MakeTransparentWindow(bitmap: TBitmap);  public  end; var Form1: TForm1; implementation procedure TForm1.FormCreate(Sender: TObject);begin  Position:=poScreenCenter; // Optional  BorderStyle:=bsNone; // It looks really buggy if this isn't done  MakeTransparentWindow(image1.Picture.Bitmap);end; procedure TForm1.MakeTransparentWindow(bitmap: TBitmap);var BlendFunction: TBlendFunction;    Size: TSize;    P: TPoint;    ExStyle: DWORD;begin  ExStyle := GetWindowLongA(Handle, GWL_EXSTYLE);  if (ExStyle and WS_EX_LAYERED = 0) then    SetWindowLong(Handle, GWL_EXSTYLE, ExStyle or WS_EX_LAYERED);  ClientWidth := bitmap.Width;  ClientHeight := bitmap.Height;  P.x := 0;  P.y := 0;  Size.cx := bitmap.Width;  Size.cy := bitmap.Height;  BlendFunction.BlendOp := AC_SRC_OVER;  BlendFunction.BlendFlags := 0;  BlendFunction.SourceConstantAlpha := 255;  BlendFunction.AlphaFormat := AC_SRC_ALPHA;  UpdateLayeredWindow(Handle, 0, nil, @Size, bitmap.Canvas.Handle, @P, 0, @BlendFunction, ULW_ALPHA);end; procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer);begin  mx:=X;  my:=Y;end; procedure TForm1.Image1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer);begin  if (ssLeft in Shift) then begin    Left := Left + X - mx;    Top := Top + Y - my;  end;end; procedure TForm1.FormKeyDown(Sender: TObject; var Key: Word; Shift: TShiftState);begin  if Key=VK_ESCAPE then close;end;And the form has a transparent PNG in TImage. ---------------------------------------------------------------------- G90210 · 2017-01-29 11:41 Thanks everyone for contribution! Any hints how to make this work for OS X? And any ideas on the vector images? ---------------------------------------------------------------------- jwdietrich · 2017-01-29 17:48 Quote from: G90210 on January 29, 2017, 12:41:40 pmThanks everyone for contribution! Any hints how to make this work for OS X? And any ideas on the vector images? I am searching for the OS X-version for years. I even tried to modify the LCL sources for the Carbon widgetset accordingly, but I wasn't successful, at least in the timeframe I could spare. ---------------------------------------------------------------------- skalogryz · 2017-01-29 18:35 Quote from: jwdietrich on January 29, 2017, 06:48:17 pmQuote from: G90210 on January 29, 2017, 12:41:40 pmThanks everyone for contribution! Any hints how to make this work for OS X? And any ideas on the vector images? I am searching for the OS X-version for years. Like this one from 2009 ? ---------------------------------------------------------------------- lainz · 2017-01-29 18:51 Someone that has access to all platforms maybe should create a cross platform solution ready to use. ---------------------------------------------------------------------- jwdietrich · 2017-01-29 20:15 Quote from: skalogryz on January 29, 2017, 07:35:00 pmQuote from: jwdietrich on January 29, 2017, 06:48:17 pmQuote from: G90210 on January 29, 2017, 12:41:40 pmThanks everyone for contribution! Any hints how to make this work for OS X? And any ideas on the vector images? I am searching for the OS X-version for years. Like this one from 2009 ? Great, this example works like a charm. Its discussion was in the wrong subforum, therefore I never found it. ---------------------------------------------------------------------- G90210 · 2017-02-05 09:53 Thanks everyone for their inputs! I am marking this topic as solved