Question

I’m working on a personal project and I have been running into lots of issues lately resulting in many questions, but hey, thats what SO is for right? 😉

Anyhow I tried making a transparent TPanel which I achieved by making a custom component.
The app im making is about world of warcraft and I made a talent calculator like on the official website but in a windows application.
Talents are spells/skills and each talent has information which is displayed in a tooltip.

So I have a tooltip with info,

I have a grid with talents and when I hover on a talent I want to see the info.
Besides that, I want the info to be shown near the position of the cursor.

Almost works. The positioning works, it shows the correct info BUT! here is the problem.
Take a look at this image:

The black semi-transparent panel is my tooltip.
You see the talents (that little 4×6 grid) those are located in a dark grey panel called pnlTalents
The parent of that panel is the lighter grey panel that covers the entire form called Panel1.
The tooltip called TooltipTalent also has the parent Panel1.
I have tried sending pnlTalents to the back and bring TooltipTalent to the front but this made no difference at all.
I even tried TooltipTalent.BringToFront; the moment the position is changed.
Notice how the tooltip has no problem being on top of that darker grey panel at the top of the screen with the speedbuttons.
I compared both panels (the one at the top and the one with the talents) and found no difference in the properties.
I am seriously running out of ideas here. I have no clue what is causing it and how I can solve this problem.

As last resort I tried dropping another transparent panel that covers the entire form to see if that would help but the problem still persisted.

I could also post the code of my custom component but that would be a lot.
If you want to see the code let me know and i’ll find a way to show it 🙂

Can anyone help me on this?
Kind regards

Answer 1

procedure TMyPanel.CreateParams(var params: TCreateParams);
begin
  params.ExStyle := params.ExStyle or WS_EX_TRANSPARENT or WS_EX_TOPMOST ;
  inherited CreateParams(params);    
end;

With a Quickhackcode I get this result

Just as example, Image1 contains a Semitransparent png:

unit Unit4;

interface

uses
  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
  Dialogs, ExtCtrls, StdCtrls, dxGDIPlusClasses;

type

  TMyPanel=Class(TPanel)
     procedure CreateParams(var params: TCreateParams); override;
     procedure WMEraseBkGnd(var msg: TWMEraseBkGnd); message WM_ERASEBKGND;
  End;


  TForm4 = class(TForm)
    Panel1: TPanel;
    Button1: TButton;
    Image1: TImage;
    Button2: TButton;
    CheckBox1: TCheckBox;
    Panel2: TPanel;
    Button3: TButton;
    Label1: TLabel;
    procedure Button1Click(Sender: TObject);
    procedure Button3Click(Sender: TObject);
  private
    { Private-Deklarationen }

   Fmp:TMyPanel;
   fisInPaint:Boolean;
  public
    { Public-Deklarationen }
  end;

var
  Form4: TForm4;

implementation

{$R *.dfm}

{ TMyPanel }

procedure TMyPanel.CreateParams(var params: TCreateParams);
begin
  params.ExStyle := params.ExStyle or WS_EX_TRANSPARENT or WS_EX_TOPMOST ;
  inherited CreateParams(params);
end;



procedure TMyPanel.WMEraseBkGnd(var msg: TWMEraseBkGnd);
begin
  SetBkMode (msg.DC, TRANSPARENT);
  msg.result := 1;
end;

procedure TForm4.Button1Click(Sender: TObject);
begin

  Fmp := TMyPanel.Create(self);
  With Fmp do
    begin
      Parent := self;
      left:= Panel1.Left -100;
      top:= Panel1.top -100;
      width := 300;
      Height := 300;
    end;
   image1.Parent := Fmp;
   Image1.Align := alClient;
   Image1.Stretch := true;
   Fmp.BringToFront;
   Label1.Parent := FMP;
   label1.Transparent := true;
   Label1.Left := 100;
   Label1.Left := 100;
end;

procedure TForm4.Button3Click(Sender: TObject);
begin
   Fmp.Left := fmp.Left + 10;
end;

end.

Can’t reproduce problem with XP either: