delphi component order and layer options

Question

I'm very new to delphi programming:( I'm trying to make a customized component with a transparent background layer and a top layer with circle shape. However, the below code works fine when added on to a form. Exception the fact that is there is another component overlaps with or on top of the the customized component, it lies below and doesn't show. I've tried below on a form

 BadgeTest1.BringToFront;
 BadgeTest1.ComponentIndex:=2;
 IndexVal:= BadgeTest1.ComponentIndex;

However, still doens't work. Is there anyway for the customized component to show on top of the other components? only the circle shape part? Also, I've been trying to place a caption in the center(horizontally and vertically) of the customized component, I've tried with TextOut() procedure. if there is a better option, could you please let me know? below is my code for the customized component called BadgeTest. Please, help, Thank you so much!

type
 TBadgeTest=class(TGraphicControl)

private
  FCaption:TCaption;
  FColor:TColor;
  FLayers:TLayerCollection;
  FHeight:Integer;
  FWidth:Integer;

protected
 procedure Paint; override;  
  procedure SetBkgLayer;      
  procedure SetSecondLayer;       
public
  constructor Create(AOwner: TComponent); override;
  destructor Destroy; override;
published
  property Caption:TCaption read FCaption write FCaption; 
end;

procedure Register;

implementation

  procedure Register;
begin
  RegisterComponents('Sample', [TBadgeTest]);
end;

constructor TBadgeTest.Create(AOwner: TComponent);
var
  ACanvas:TcxCanvas;
   begin
   inherited;
   FHeight:=20;
  Self.Height:=FHeight;
  Constraints.MaxHeight:=20;
  Constraints.MinHeight:=20;
  FHeight:=20;
  Self.Width:=FWidth;
  Constraints.MaxWidth:=20;
  Constraints.MinWidth:=20;
end;

destructor TBadgeTest.Destroy;
begin
  inherited;
end;

 procedure TBadgeTest.SetBkgLayer;   
 var
  Bitmap:TBitmap32;
  Layer: TCustomLayer;
 begin
  FLayers := TLayerCollection.Create(Self);
  Layer := FLayers.Add(TBitmapLayer);
  Layer.Index:=0;
  Bitmap:= TBitmap32.Create;
  Bitmap.DrawMode:=dmOpaque;
  Bitmap.SetSize(Width, Height);
  Bitmap.clear($00000000);

  Bitmap.Canvas.Pen.Width:=0;
  Bitmap.Canvas.Brush.Color:=$00107EFF;
  Bitmap.Canvas.Brush.Style:=bsClear;
  Bitmap.Canvas.Ellipse(Rect(0,0,20,20));
end;

  procedure TBadgeTest.SetSecondLayer;
var
  Bitmap:TBitmap32;
  Layer: TCustomLayer;
 begin
  Layer := FLayers.Add(TBitmapLayer);
  Layer.Index:=1;
  Layer.LayerOptions:= LOB_VISIBLE;
  Bitmap:=TBitmap32.Create;
  Bitmap.DrawMode:=dmCustom;
  Bitmap.SetSize(Width, Height);
  Bitmap.clear($00000000);

  Bitmap.Canvas.Pen.Width:=0;
  Bitmap.Canvas.Brush.Color:=$00107EFF;   //FF7E10
  Bitmap.Canvas.Brush.Style:=bsSolid;
  Bitmap.Canvas.Ellipse(Rect(0,0,Self.Width,Self.Height));

  Layer.BringToFront;
  Layer.BringToFront;
  //Layer.Scaled:=true;
  //  Layer.Bitmap:=Bitmap;
  end;

    procedure TBadgeTest.Paint;
var
    R:TRect;
    borderColor : Integer;
    fillCircle : Integer;  
    fontColor : Integer;  
    fontSize : Integer;   
    Bitmap:TBitmapImage;
  const
  _FF7E10_COLOR:Integer = $00107EFF; //#FF7E10           

 begin
  inherited;
  borderColor:=_FF7E10_COLOR;
  fillCircle:=_FF7E10_COLOR;

  Canvas.Pen.Create;
  Canvas.Pen.Style:=psClear;
  Canvas.Pen.Color:=borderColor;
  Canvas.Pen.Width:=0;

  SetBkgLayer;
  SetSecondLayer;

  Canvas.Brush.Create;
  Canvas.Brush.Style:= bsClear;
  Canvas.Brush.Color:=fillCircle;
  Canvas.Ellipse(0,0,Self.Width,Self.Height);
  Canvas.Font.Color:=clWhite;
  Canvas.Font.Name:='Arial';
  Canvas.Font.Size:=8;
  Canvas.Font.Quality := fqNonAntialiased;
  Canvas.Font.Style := [fsBold];

  R.Create(0, 0, Self.Width, Self.Height);
  //DrawText(Canvas.Handle, PChar(FCaption), -1, R, vaCenter);
 // Canvas.DrawText(FCaption, R, taCenter, vaCenter, False, False);
  Canvas.TextOut(5, 5, FCaption);
  //SetTextAlign(Canvas.Handle, ta_center);
  //DrawText(Canvas.Handle, PChar(FCaption),
  //R.Create(1, 10, 2, 26);
   //  Self.Width := Canvas.TextWidth(FCaption) + 30;
end;

score 5 · Accepted Answer · edited May 23 '17 at 12:05

A TGraphicControl has no window handle, and is simply painted on its Parent DC.
You can't bring a TGraphicContol in front of a TWinContol descendant (such as TPanel, TButton, TEdit etc).

Either use a TWinControl descendant as shown in your previous question which could be brought in front of other child TWinControl, or redesign your UI in such a way that eliminates a situation where another TWinControl overlaps with or on top of your customized graphic control.

P.S: visual controls are referred to as "Controls", not "Components" (which are non-visual)

delphi component order and layer options

1 Answers1