FMX.ListViewAddThumbAndCaption Sample
This is a project that shows how to customize the appearance of a TListView to show a thumbnail with a caption on the left-hand side of every list view item. It does this by modifying the appearance of the list view at run time.
Location
You can find the ListViewAddThumbAndCaption Sample sample project at:
- Start | Programs | Embarcadero RAD Studio Alexandria | Samples and navigate to:
Object Pascal\Multi-Device Samples\User Interface\ListView\ListViewAddThumbAndCaptionCPP\Multi-Device Samples\User Interface\ListView\ListViewAddThumbAndCaption
- Subversion Repository:
- You can find Delphi and C++ code samples in GitHub Repositories. Search by name into the samples repositories according to your RAD Studio version.
Description
When you run the application, it shows a list view. Each list item shows a thumbnail image with a caption on the right-hand side corner.
You can tap the ToggleEditMode button to have the list view enter a selection edit mode where you can select several items. The buttons at the bottom, LiveBindings and Fill in Code, let you fill the list view with items defined using LiveBindings or defined at run time, respectively.
How to Use the Sample
- Navigate to the one of the locations given above, and open:
- Delphi: SampleListViewAddThumbAndCaptionProject.dproj
- C++: SampleListViewAddThumbAndCaptionProject.cbproj
- Press F9 or choose Run > Run.
Implementation
To render the thumbnail and caption on each list view item the application handles the OnUpdateObjects event of the list view. For each list view instance, the application creates and initializes the required TListItemImage instance that will hold the thumbnail and the TListItemText instance that will hold the caption.
When using LiveBindings, the application handles the OnFilledListItem event of the instance of TLinkFillControlToField to fill list view items with the required data for their new fields: the bitmap of the thumbnail and the text of the caption.
You can change at design time the values of the ItemAppearance.ItemAppearance and ItemAppearance.ItemEditAppearance properties of the list view to see how, at run time, the application extends any selected appearance with a thumbnail and a caption on the right-hand side of each item.
- Note: This application is not meant to work with every item appearance, but you can make it work with all of them.
The LiveBindings button uses TLinkFillControlToField to fill the list view using LiveBindings. The Fill in Code button uses a for loop to fill the list view with items created at run time.
Uses
- FMX.ListView.TListView
- FMX.ListView.TListView.OnUpdateObjects
- FMX.ListView.Types.TListItemImage
- FMX.ListView.Types.TListItemText
- Data.Bind.Components.TCustomBindList.OnFilledListItem
- Data.Bind.Components.TLinkFillControlToField
- FMX.ListView.TAppearanceListView.ItemAppearance
- FMX.ListView.Appearances.TPublishedAppearance.ItemEditAppearance