TListView DesignMode and DynamicAppearance

Getting to grips with TListView DesignMode and DynamicAppearance, part of the 10 Berlin release of RAD Studio


The TListView is a fast scrollable list that is typically used to display, select and navigate through data.

For those new to the TListView using FireMonkey see FMX TListView tutorial

TListView DesignMode

With the release of RAD Studio 10 Berlin, it is now possible to modify the look of TListView Items, TListView Header and TListView footer using the Toggle DesignMode.

When you right-click your list view on the Form Designer and select the new Toggle DesignMode, you enable the visual list view item editor. Rather than having to manually adjust the position of each component that makes up the item layout, you can now visually modify the control.

TListView DesignMode
Using the TListView DesignMode

TListView DynamicAppearance

The listview control also supports a new type of item appearance (also available for the edit mode), DynamicAppearance, that you can use to customise the elements that make up your list view: labels, images, buttons, and so on.

DynmanicAppearance for use with TListView DesignMode
TListView ItemAppearance set to DynamicAppearance, adding new items to the design

On your TListView item change the ItemAppearance property to DynamicAppearance, and then use the + to add in new objects.

Once added they appear under the Objects and can be renamed and modified manually as before or you can use the design mode to modify them.


5 thoughts on “TListView DesignMode and DynamicAppearance”

  1. Hi

    How i can to assign by code this property ( text2/3.. ) ?

    lvAnagrafiche.Items[0].Objects.DrawableByName(‘Text2’).Data.AsString := ‘New Value’;

    DrawableByName is read only.

    Thank again for good article 🙂

    1. Use the Data property for example

      procedure TForm2.Button1Click(Sender: TObject);
      LVI: TListViewItem;
      LVI := ListView1.Items.Add;
      LVI.Data[‘Text1’] := ‘Hello’;
      LVI.Data[‘Text2’] := ‘World’;

      1. Hi, on your example above, how to get value of Data[‘Text1’] on selected ListView1 in Form

        I was try something like :
        LVI: TListViewItem;
        result : string;

        LVI :=ListView1.Selected;
        result := LVI.Data[‘Text1’].toString;

        and not working (this is not real code just logic)


        1. This works for me. Create a new app with a button and a TListView and use the Button click and OnItemClick

          procedure TForm1.Button1Click(Sender: TObject);
          LVI: TListViewItem;
          s: string;
          LVI := ListView1.Items.Add;
          s := ‘Hello ‘+ListView1.Items.Count.ToString;
          LVI.Text := s;
          LVI.Data[‘MyData’] := s;

          procedure TForm1.ListView1ItemClick(const Sender: TObject;
          const AItem: TListViewItem);
          if Assigned(AItem) then
          Self.Caption := AItem.Data[‘MyData’].AsString
          Self.Caption := ‘ – none -‘;

  2. Hello, I guess this notation will please you

    To get a field (in this case Text3) of the current record in the TListView, use this


Leave a Reply

Your email address will not be published. Required fields are marked *