Delphi FMX: Adding and Removing Components to/From Scrollbar

  

I am trying to create the preview list in my app which have image label and a button.

This is the code I am currently using:

unit Unit2;

interface

uses
System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs,
FMX.Controls.Presentation, FMX.StdCtrls, FMX.Layouts, FMX.Edit, FMX.Objects,
FMX.ListBox;

type
TForm2 = class(TForm)
vs: TVertScrollBox;
Panel1: TPanel;
Image1: TImage;
OpenDialog1: TOpenDialog;
GroupBox1: TGroupBox;
btnLoad: TCornerButton;
btnAdd: TCornerButton;
btnClear: TCornerButton;
VertScrollBox1: TVertScrollBox;
ListBox1: TListBox;
procedure BtnLoadClick(Sender: TObject);
procedure btnRemoveClick(Sender: TObject);
procedure BtnAddClick(Sender: TObject);
procedure rectClick(Sender: TObject);
procedure btnClearClick(Sender: TObject);
private
{ Private declarations }
public
{ Public declarations }
end;

var
Form2: TForm2;
i: integer;
rect: TRectangle;
Title : TLabel;
Preview: TImage;
bitmap: TBitmap;
sl: TStringList;
btnRemove: TButton;

implementation

{$R *.fmx}

procedure TForm2.btnClearClick(Sender: TObject);
begin
Sl:= TStringList.Create;
sl.Clear;
SL.Free;
for I := 0 to Vs.ComponentCount – 1 do
begin
vs.Components[i].Free;
end;
end;

procedure TForm2.BtnLoadClick(Sender: TObject);
begin
if OpenDialog1.Execute then
Image1.Bitmap.LoadFromFile(OpenDialog1.FileName);
end;

procedure TForm2.rectClick(Sender: TObject);
begin
Image1.Bitmap.Assign(TImage(Sender).Bitmap);
end;

procedure TForm2.btnRemoveClick(Sender: TObject);
begin
sl:=TStringList.Create;
//how to remove entry from string list ??
TButton(Sender).Parent.Parent.Free;
sl.Free;
end;

procedure TForm2.BtnAddClick(Sender: TObject);
begin
I:= I + 1;

Rect:= TRectangle.Create(self);
Rect.Parent:= Vs;
Rect.Height:= 60;
Rect.Align:= TAlignLayout.Top;
Rect.Margins.Bottom:= 2;

bitmap:= TBitmap.Create;
bitmap.Height:=Image1.Bitmap.Height;
bitmap.Width:= Image1.Bitmap.Width;
bitmap.CopyFromBitmap(Image1.Bitmap);

Preview:= TImage.Create(self);
Preview.Parent:=Rect;
Preview.Align:= TAlignLayout.Top;
Preview.Height:= 40;
Preview.Bitmap.Assign(bitmap);
Preview.OnClick:= rectClick;

btnRemove:= TButton.Create(self);
btnRemove.Parent:=Preview;
btnRemove.Text:=’X’;
btnRemove.Width:=20;
btnRemove.Height:=20;
btnRemove.OnClick:= btnRemoveClick;

Title:= TLabel.Create(self);
Title.Parent:= Rect;
Title.Align:= TAlignLayout.Top;
Title.Height:= 20;
Title.Text:= ‘User’ + IntTOStr(I);

SL:= TStringList.Create;
SL.Add(Title.Text);
SL.Free;
bitmap.Free;

end;

end.

Adding PreviewItem to VerticleScrollBar and adding string to SL or StringList is working but I don’t know how to handle the btnRemove of PreviewItem correctly to remove string from SL.

The StringList used to print images which are in VerticleScrollBar or in list ofSL.

And Alignment of Rectangles of PreviewItem are set to Top but last added item is all the way bottom as you can see in the picture uploaded.

How can I handle btnRemove Correctly?

Comments are closed.