This question already has an answer here:

Custom component controls keep re-creating

1 answer

I’m trying to create (at first) a simple FMX Component.
The goal is to have a label inside the component and when I click the label to respond to his internal onclick event.

const
_MS_Color_Transparent_Buttons = claWhite;
_MS_Color_Light_Background = claWhite;
_MS_Color_Dark_Background = $FF1F2222;
_MS_Color_Medium_Dark_Background = $FF3D454C;
_MS_Color_Active_Selection = $FF0281FD;
_MS_Color_Separation_Lines = $FFE1E0E0;

type
TPosItemLayout = class(TLayout)
private
{ Private declarations }
protected
{ Protected declarations }
LayMarker : TLayout;
rectMarker : TRectangle;
labelDescription : TLabel;

procedure ToggleComponent(Sender : TObject);
public
{ Public declarations }
constructor Create(AOwner: TComponent); override;
destructor Destroy; override;
published
{ Published declarations }
end;

constructor TPosItemLayout.Create(AOwner: TComponent);
begin
inherited;
Self.ClipChildren := True;
Self.Parent := AOwner as TFmxObject;
Self.Position.X := 0;
Self.Height := 153;
Self.HitTest := True;

LayMarker := TLayout.Create(Self);
LayMarker.Parent := Self;
LayMarker.Position.X := 0;
LayMarker.Position.Y := 0;
LayMarker.Height := 153;
LayMarker.Width := 3;
LayMarker.Align := TAlignLayout.Left;
LayMarker.HitTest := True;

//rectMarker
rectMarker := TRectangle.Create(LayMarker);
rectMarker.Parent := LayMarker;
rectMarker.Position.X := 0;
rectMarker.Position.Y := 0;
rectMarker.Height := 153;
rectMarker.Width := 3;
rectMarker.Fill.Color := _MS_Color_Active_Selection;
rectMarker.Fill.Kind := TBrushKind.Solid;
rectMarker.Stroke.Color := _MS_Color_Active_Selection;
rectMarker.Stroke.Kind := TBrushKind.None;
rectMarker.Align := TAlignLayout.Client;
rectMarker.HitTest := True;

//lbFirstDecription – Parent LayDescription
labelDescription := TLabel.Create(Self);
labelDescription.Parent := Self;
labelDescription.Position.Y := 8;
labelDescription.Height := 23;
labelDescription.Align := TAlignLayout.Horizontal;
labelDescription.StyledSettings := labelDescription.StyledSettings – [TStyledSetting.FontColor, TStyledSetting.Size];
labelDescription.FontColor := claBlack;
labelDescription.TextSettings.Font.Size := 16;
labelDescription.TextSettings.HorzAlign := TTextAlign.Leading;
labelDescription.TextSettings.VertAlign := TTextAlign.Center;
labelDescription.Text := ‘Description’;
labelDescription.WordWrap := False;
labelDescription.HitTest := True;
labelDescription.OnClick := ToggleComponent;
end;

destructor TPosItemLayout.Destroy;
begin

inherited;
end;

procedure TPosItemLayout.ToggleComponent(Sender: TObject);
begin
showmessage(‘toggle’);
end;

in my test application i click on then label but nothing happend.

i have try to play around hittest but nothing.

what i miss?

how can I do to make it work?

EDIT 1
I have change the code. the onclick on the original code is hidden 🙁
the following code is act semibizar.

type
TPosItemLayout = class(TLayout)
private
{ Private declarations }
protected
{ Protected declarations }
imgDelete : TButton;

procedure ToggleComponent(Sender : TObject);
public
{ Public declarations }
constructor Create(AOwner: TComponent); override;
destructor Destroy; override;
published
{ Published declarations }
property btnDelete : TButton read imgDelete;
end;

procedure Register;

implementation

procedure Register;
begin
RegisterComponents(‘Samples’, [TPosItemLayout]);
end;

{ TPosItemLayout }

constructor TPosItemLayout.Create(AOwner: TComponent);
var ImgStream : TResourceStream;
begin
inherited;
Self.ClipChildren := True;
Self.Position.X := 0;
Self.Height := 153;
Self.Width := 400;

imgDelete := TButton.Create(Self);
imgDelete.Parent := Self;
imgDelete.Width := 60;
imgDelete.Height := 24;
imgDelete.HitTest := True;
imgDelete.Align := TAlignLayout.Right;
imgDelete.Text := ‘E’;
imgDelete.OnClick := ToggleComponent;
end;

destructor TPosItemLayout.Destroy;
begin

inherited;
end;

procedure TPosItemLayout.ToggleComponent(Sender: TObject);
begin
imgDelete.Text := ‘Click’;
end;

at design time it create the button and align right
but at run time 2 button are crated .. one respond to click and do what is intend to do .. the other doesent do nothing.

how to track this problem ?

this messup is created by the IDE. If i change the text on the button and close / open the project another button appear. change the text on the new button close/open another is created. and so on.