How do detailed card list in listview in Delphi?

To create a detailed card list in a TListView in Delphi, you can use the TListView component along with the TListViewItem and TListViewItemDetail components. Each TListViewItem represents a card in the list, and TListViewItemDetail components within each item can be used to display additional details.

Here’s a basic example:

Drop a TListView component onto your form.
Set the ItemAppearance property of the TListView to “DynamicAppearance”.
Add TListViewItem components to the TListView. For each item, add TListViewItemDetail components to represent the details.

Here’s a simple example using the Delphi FMX framework:

unit MainForm;

interface

uses
  System.SysUtils, System.Types, System.UITypes, System.Classes,
  System.Variants, FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics,
  FMX.Dialogs, FMX.ListView.Types, FMX.ListView.Appearances,
  FMX.ListView.Adapters.Base, FMX.ListView, FMX.ListView.Appearances.StdCtrls,
  FMX.Objects;

type
  TForm1 = class(TForm)
    ListView1: TListView;
    procedure FormCreate(Sender: TObject);
  private
    procedure AddCardToList(const Title, Subtitle: string; Image: TBitmap);
  public
    { Public declarations }
  end;

var
  Form1: TForm1;

implementation

{$R *.fmx}

procedure TForm1.FormCreate(Sender: TObject);
begin
  // Add cards to the list
  AddCardToList(‘Card 1’, ‘Subtitle 1’, Image1.Bitmap);
  AddCardToList(‘Card 2’, ‘Subtitle 2’, Image2.Bitmap);
  // Add more cards as needed
end;

procedure TForm1.AddCardToList(const Title, Subtitle: string; Image: TBitmap);
var
  ListViewItem: TListViewItem;
  ImageItemDetail: TListViewItemDetail;
begin
  // Create a new ListView item
  ListViewItem := ListView1.Items.Add;

  // Set the main text of the item
  ListViewItem.Text := Title;

  // Create a detail for the subtitle
  ImageItemDetail := ListViewItem.DetailText;
  ImageItemDetail.Text := Subtitle;

  // Create a detail for the image
  ImageItemDetail := ListViewItem.DetailImage;
  ImageItemDetail.Bitmap := Image;
end;

end.

unit MainForm;

interface

uses

System.SysUtils, System.Types, System.UITypes, System.Classes,

System.Variants, FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics,

FMX.Dialogs, FMX.ListView.Types, FMX.ListView.Appearances,

FMX.ListView.Adapters.Base, FMX.ListView, FMX.ListView.Appearances.StdCtrls,

FMX.Objects;

type

TForm1 = class(TForm)

ListView1: TListView;

procedure FormCreate(Sender: TObject);

private

procedure AddCardToList(const Title, Subtitle: string; Image: TBitmap);

public

{ Public declarations }

end;

var

Form1: TForm1;

implementation

{$R *.fmx}

procedure TForm1.FormCreate(Sender: TObject);

begin

// Add cards to the list

AddCardToList(‘Card 1’, ‘Subtitle 1’, Image1.Bitmap);

AddCardToList(‘Card 2’, ‘Subtitle 2’, Image2.Bitmap);

// Add more cards as needed

end;

procedure TForm1.AddCardToList(const Title, Subtitle: string; Image: TBitmap);

var

ListViewItem: TListViewItem;

ImageItemDetail: TListViewItemDetail;

begin

// Create a new ListView item

ListViewItem := ListView1.Items.Add;

// Set the main text of the item

ListViewItem.Text := Title;

// Create a detail for the subtitle

ImageItemDetail := ListViewItem.DetailText;

ImageItemDetail.Text := Subtitle;

// Create a detail for the image

ImageItemDetail := ListViewItem.DetailImage;

ImageItemDetail.Bitmap := Image;

end;

end.

In this example:

TListView is set to use the “DynamicAppearance” in the ItemAppearance property.
The AddCardToList procedure is used to add a new card to the list. It takes a title, subtitle, and an image (represented by a TBitmap).
Multiple TListViewItem components are added to the TListView, each representing a card.
For each item, TListViewItemDetail components are used to represent the details (subtitle and image).

You can customize the appearance and add more details based on your specific requirements.

How do detailed card list in listview in Delphi?

Comments

Leave a Reply Cancel reply