FMX: dropping selfmade component on form duplicates subcomponents

  

I created my own progressbar (TProgressBalken) consisting of a TRectangle, within that there’s another TRectangle (a) with a different color, its width varies with the progress value (0..100). Finally a Tlabel sits on top of it displaying the current value as text.
All works fine when creating this component at runtime.

When dropping this on a new multidevice form (IDE set to 32-bit windows) it also works fine.
But when switching IDE to Android, TRectangle(a) and Label are duplicated in the fmx file, I see now the label painted twice. And Delphi complains of duplicated items.

Originally I assigned no name to TRectangle(a) and Label, but Delphi complained, so I assigned names during creation, but the actual problem remains.

Any idea what is missing?

This is my component:

unit ProgressBalken;

interface
uses
System.SysUtils, System.Classes, System.UITypes,
FMX.Types, FMX.Controls, FMX.Forms, FMX.StdCtrls, FMX.Graphics, FMX.Objects;

type
TProgressBalken = class(TRectangle)
procedure FormDestroy(Sender: TObject);
procedure BalkenUpdate;
procedure SizeUpdate;
procedure SetValue(v: integer);
procedure SetUnits(v: string);
procedure SetBalkenColor(v: TAlphaColor);
function GetBalkenColor: TAlphaColor;
procedure aResize(Sender: TObject);
private
Balken: TRectangle;
labelx: Tlabel;
fValue: integer;
funits: string;
public
constructor Create(AOwner: TComponent); override;

published
property Value: integer read fValue write SetValue;
property ValueUnits: string read fUnits write SetUnits;
property BalkenColor: TAlphaColor read GetBalkenColor write SetBalkenColor; // stored IsColorStored;
end;

procedure Register;

implementation
uses
windows, System.Math;

constructor TProgressBalken.Create(AOwner: TComponent);
begin
inherited;
width:=100;
height:= 40;
fValue:= 1;
fUnits:= ”;
Parent:= TForm(AOwner);
Fill.Color:= System.UITypes.TAlphaColorRec.red; //Null;
Balken:= TRectangle.Create(self);
Balken.Parent:= self;
Balken.Position.X:= 0;
Balken.Position.Y:= 0; ;
Balken.Fill.Color:= System.UITypes.TAlphaColorRec.Aqua;
Balken.name:= ‘balken’+name;
labelx:= Tlabel.Create(self);
labelx.Parent:= Balken;
labelx.name:= ‘labelx’+name;
OnResize:= aResize;
SizeUpdate;
end;

procedure TProgressBalken.aResize(Sender: TObject);
begin
SizeUpdate;
end;

procedure TProgressBalken.FormDestroy(Sender: TObject);
begin
Balken.Free;
labelx.Free;
inherited;
end;

procedure TProgressBalken.SizeUpdate;
var
h, y: single;
begin
Balken.Height:= Height;
Balken.Width:= Width;
h:= System.Math.min(40, Height);
labelx.StyledSettings:= labelx.StyledSettings – [TStyledSetting.Size];
if h>20 then
labelx.TextSettings.Font.Size:= round(0.5 * h)
else
labelx.TextSettings.Font.Size:= round(0.7 * h);
y:= (height / 2) – (labelx.TextSettings.Font.Size / 2) -2;
labelx.Position.Y:= System.Math.max(-5, y);
labelx.Position.X:= Width / 4;
BalkenUpdate;
end;

procedure TProgressBalken.BalkenUpdate;
begin
Balken.Width:= fValue / 100 *(width – 2*Balken.Position.x);
labelx.Text:= IntToStr(fValue) +’ ‘ +fUnits;
end;

procedure TProgressBalken.SetValue(v: integer);
var i: integer;
begin
v:= System.Math.max(v, -1);
fValue:= System.Math.min(v, 100);
BalkenUpdate;
end;

procedure TProgressBalken.SetUnits(v: string);
begin
fUnits:= v;
SetValue(fValue);
end;

function TProgressBalken.GetBalkenColor: TAlphaColor;
begin
result:= Balken.Fill.Color;
end;

procedure TProgressBalken.SetBalkenColor(v: TAlphaColor);
begin
Balken.Fill.Color:= v;
end;

procedure Register;
begin
RegisterComponents(‘3s_Spezielles’, [TProgressBalken]);
end;

initialization
RegisterFmxClasses([TProgressBalken]);

end.

This is the fmx after dropping my component TProgressBalken
IDE is set to 32-Bit Windows

object Form1: TForm1
Left = 0
Top = 0
Caption = ‘Form1’
ClientHeight = 480
ClientWidth = 640
FormFactor.Width = 320
FormFactor.Height = 480
FormFactor.Devices = [Desktop]
DesignerMasterStyle = 3
object Button1: TButton
Position.X = 56.000000000000000000
Position.Y = 168.000000000000000000
TabOrder = 1
Text = ‘Button1’
OnClick = Button1Click
end
object ProgressBalken1: TProgressBalken
Fill.Color = claRed
Position.X = 40.000000000000000000
Position.Y = 64.000000000000000000
Size.Width = 100.000000000000000000
Size.Height = 40.000000000000000000
Size.PlatformDefault = False
Value = 1
BalkenColor = claAqua
object balken: TRectangle
Fill.Color = claAqua
Size.Width = 1.000000000000000000
Size.Height = 40.000000000000000000
Size.PlatformDefault = False
object labelx: TLabel
StyledSettings = [Family, Style, FontColor]
Position.X = 25.000000000000000000
Position.Y = 8.000000000000000000
TextSettings.Font.Size = 20.000000000000000000
Text = ‘1 ‘
end
end
end
end

This is the fmx after setting IDE to Android
object ‘balken’ is now inserted twice

object Form1: TForm1
Left = 0
Top = 0
Caption = ‘Form1’
ClientHeight = 480
ClientWidth = 640
FormFactor.Width = 320
FormFactor.Height = 480
FormFactor.Devices = [Desktop]
DesignerMasterStyle = 0
object Button1: TButton
Position.X = 56.000000000000000000
Position.Y = 168.000000000000000000
TabOrder = 1
Text = ‘Button1’
OnClick = Button1Click
end
object ProgressBalken1: TProgressBalken
Fill.Color = claRed
Position.X = 40.000000000000000000
Position.Y = 64.000000000000000000
Size.Width = 100.000000000000000000
Size.Height = 40.000000000000000000
Size.PlatformDefault = False
Value = 1
BalkenColor = claAqua
object balken: TRectangle
Fill.Color = claAqua
Size.Width = 1.000000000000000000
Size.Height = 40.000000000000000000
Size.PlatformDefault = False
object labelx: TLabel
StyledSettings = [Family, Style, FontColor]
Position.X = 25.000000000000000000
Position.Y = 8.000000000000000000
TextSettings.Font.Size = 20.000000000000000000
Text = ‘1 ‘
end
end
object balken: TRectangle
Fill.Color = claAqua
Size.Width = 1.000000000000000000
Size.Height = 40.000000000000000000
Size.PlatformDefault = False
object labelx: TLabel
StyledSettings = [Family, Style, FontColor]
Position.X = 25.000000000000000000
Position.Y = 8.000000000000000000
TextSettings.Font.Size = 20.000000000000000000
Text = ‘1 ‘
end
end
end
end

Comments are closed.