procedure TForm2.Button1Click(Sender: TObject);
CR := TCalloutRectangle.Create(Self);
CR.Parent := VSB;
CR.Align := TAlignLayout.alTop;
CR.CalloutPosition := TCalloutPosition.cpLeft;
CR.Margins.Top := 10;
CR.Margins.Bottom := 10;
CR.Margins.Right := 5;
CR.Height := 75;
L := TText.Create(Self);
L.Parent := CR;
L.Align := TAlignLayout.alClient;
L.Text := 'A quick brown fox jumped over the yellow log running away from the pink dog and ran down the lane.';
L.Margins.Left := 15;
L.Margins.Right := 5;
L.Width := CR.Width-20;
L.WordWrap := True;
L.AutoSize := True;
L.OnPaint := LabelPaint;
TmpImg := TImage.Create(Self);
TmpImg.Parent := CR;
TmpImg.Align := TAlignLayout.alRight;
TmpImg.Width := 75;
Download the Delphi XE5 Firemonkey Demo Messenger Layout With Source
Update: There is also an update available which uses this code and includes a full XMPP messenger component for Delphi XE6 Firemonkey which you can read about here.
Update 2: You can also use TTMSFMXTableView in the TMS Pack for Firemonkey to achieve this same effect with much less code.
Nice Code !
I have one question:
I tried that code and every message appears at the top o Vertical Scroll Box.
Usually, the most recent message is at the bottom. How can I do that ?
Going the other way is more difficult.
Something like this might let you set the location of the scroll. You can tweak it so it uses the height of the scrollbox plus the new message height. You’ll have to experiment.
VertScrollBox2.ViewportPosition:=pointf(0,0); // go to top
Thnx for this nice workaround 🙂
Another way using a third party component: