Anpassen der Darstellung von FireMonkey-Listenansichten

Aus RAD Studio
Wechseln zu: Navigation, Suche

Nach oben zu FireMonkey-Anwendungsdesign

Sie können die Darstellung einer FireMonkey-Listenansicht anpassen, indem Sie das Layout der Listeneinträge, wie den Titel, die zugehörigen Bilder, Textdetails oder das Zusatzsymbol, ändern.

AndroidScreen.png LBListView Android.png

Anpassen der Darstellungseigenschaften von Listenansichten

Beim Entwurf können Sie die Darstellung der Fußzeile, der Kopfzeile und der Listeneinträge (auch für den Bearbeitungsmodus) ändern, indem Sie die Werte der Eigenschaften in der Eigenschaft ItemAppearance anpassen. Die Eigenschaft "ItemAppearance" steuert die Darstellungsgröße der Fußzeile, der Kopfzeile und der Einträge (im Anzeige- und im Bearbeitungsmodus).

Die folgenden Darstellungseigenschaften einer Listenansicht (TListView) sind im Objektinspektor und in der StructureView gruppiert, und Sie können deren Werte ändern, um die Darstellung der Listenansicht individuell anzupassen.

Eigenschaften für Fußzeilen

  • FooterHeight. Diese Eigenschaft legt die Höhe (in Pixel) für die Fußzeile der Liste fest. Vorgabewert: 24.
  • FooterAppearance. Diese Eigenschaft legt die grafische Darstellung der Fußzeile fest. Mögliche Werte sind: Custom und ListHeader. Vorgabewert: ListHeader.

Eigenschaften für Kopfzeilen

  • HeaderHeight. Diese Eigenschaft legt die Höhe (in Pixel) für die Kopfzeile der Liste fest. Vorgabewert: 24.
  • HeaderAppearance. Diese Eigenschaft legt die grafische Darstellung der Kopfzeile fest. Mögliche Werte sind: Custom und ListHeader. Vorgabewert: ListHeader.

Eigenschaften für Listeneinträge

  • ItemHeight. Diese Eigenschaft legt die Höhe (in Pixel) für Listeneinträge fest. Vorgabewert: 44.
  • ItemAppearance. Diese Eigenschaft legt die grafische Darstellung des Eintrags (Bild, Titel, Zusatzschaltfläche etc.) fest. Vorgabewert: ListItem.
Wählen Sie einen der folgenden Werte:
Eigenschaft Sichtbare Objekte
Custom Siehe Verwenden des Werts "Custom"
DynamicAppearance Siehe Verwenden des Werts "DynamicAppearance"
ImageListItem Ein Bild, ein Titel und eine zusätzliche grafische Schaltfläche
ImageListItemBottomDetail Ein Bild, ein Titel, ein detaillierter Text und eine zusätzliche grafische Schaltfläche
ImageListItemBottomDetailRightButton Ein Bild, ein Titel, ein detaillierter Text und eine zusätzliche Textschaltfläche
ImageListItemRightButton Ein Bild, ein Titel und eine zusätzliche Textschaltfläche
ListItem Ein Titel und eine zusätzliche grafische Schaltfläche
ListItemRightDetail Ein Titel, ein detaillierter Text und eine zusätzliche grafische Schaltfläche

Verwenden Sie den Kontextmenübefehl Bearbeitungsmodus umschalten, um die Entwurfszeitansicht der Einträge im ListView-Objekt im Formular-Designer in den Bearbeitungsmodus umzuschalten. Um in den Bearbeitungsmodus zu wechseln, klicken Sie in der Strukturansicht oder im Formular-Designer mit der rechten Maustaste auf das TListView-Objekt und wählen Bearbeitungsmodus umschalten.

Siehe FMX.ListViewCustomBottomDetail (Beispiel) und andere Beispiele.

Eigenschaften von Listeneinträgen im Bearbeitungsmodus

  • ItemEditHeight. Diese Eigenschaft legt die Höhe (in Pixel) für Listeneinträge im Bearbeitungsmodus fest. Vorgabewert: 44.
  • ItemEditAppearance. Diese Eigenschaft legt die grafische Darstellung des Eintrags im Bearbeitungsmodus fest. Vorgabewert: ListItemShowCheck.
Wählen Sie einen der folgenden Werte:
Eigenschaft Sichtbare Objekte
Custom Siehe Verwenden des Werts "Custom"
DynamicAppearance Siehe Verwenden des Werts "DynamicAppearance"
ImageListItemBottomDetailRightButtonShowCheck Ein Bild, ein Titel, ein detaillierter Text, ein Kontrollkästchen mit einer Glyphe und eine Textschaltfläche
ImageListItemBottomDetailShowCheck Ein Bild, ein Titel, ein detaillierter Text, ein Kontrollkästchen mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ImageListItemDelete Ein Bild, ein Titel, eine Löschen-Schaltfläche mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ImageListItemRightButtonDelete Ein Bild, ein Titel, eine Löschen-Schaltfläche mit einer Glyphe und eine Textschaltfläche
ImageListItemRightButtonShowCheck Ein Bild, ein Titel, ein Kontrollkästchen mit einer Glyphe und eine Textschaltfläche
ImageListItemShowCheck Ein Bild, ein Titel, ein Kontrollkästchen mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ListItemDelete Ein Titel, eine Löschen-Schaltfläche mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ListItemRightDetailDelete Ein Titel, ein detaillierter Text, eine Löschen-Schaltfläche mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ListItemRightDetailShowCheck Ein Titel, ein detaillierter Text, ein Kontrollkästchen mit einer Glyphe und eine zusätzliche grafische Schaltfläche
ListItemShowCheck Ein Titel, ein Kontrollkästchen mit einer Glyphe und eine zusätzliche grafische Schaltfläche


Siehe FMX.ListViewCustomBottomDetail (Beispiel) und andere Beispiele.

Ändern der Darstellungseigenschaften von Listenansichten

Suchen Sie in der Strukturansicht und im Objekinspektor nach der Listenansichts-Komponente.

ItemAppearenceValueListView.png

Anpassbare Darstellung von Einträgen

Mit den Werten DynamicAppearance und Custom können Sie die Darstellung von Einträgen in einer ListView anpassen. Verwenden Sie den Wert Custom für die Eigenschaften FooterAppearance, HeaderAppearance, ItemAppearance und ItemEditAppearance der Einträge in der ListView und DynamicAppearance für die Eigenschaften ItemAppearance und ItemEditAppearance der Einträge in der ListView.

Verwenden des Werts "DynamicAppearance"

Mit DynamicAppearance können Sie die Eintragsdarstellung der ListView zur Entwurfszeit dynamisch anpassen. Der Unterschied zwischen DynamicAppearance und den anderen Eigenschaften der Eintragsdarstellung besteht darin, dass Sie mit DynamicAppearance dem Erscheinungsbild Ihres Eintrags so viele Objekte wie gewünscht hinzufügen können.

DynamicAppearence enthält standardmäßig ein einziges Text-Objekt. Um weitere Objekte hinzuzufügen, wählen Sie in der Strukturansicht Item von IteamAppearance aus. Klicken Sie dann im Objektinspektor auf die Eigenschaft +, und wählen Sie beliebige der verfügbaren Objekte aus. Die verfügbaren Objekte sind:

DynamicAppearence.png

Sie können die Objekte des Eintragserscheinungsbilds zur Entwurfszeit anpassen, indem Sie ein Objekt in der Strukturansicht auswählen und dessen Eigenschaften im Objektinspektor ändern. Unter anderem können Sie Folgendes ändern: die Schriftart, die Textgröße oder die Textausrichtung in Textobjekten oder den Schaltflächentyp in Schaltflächenobjekten. Darüber hinaus können Sie die Objekte des Eintragserscheinungsbilds visuell durch Aktivieren von Entwurfsmodus umschalten anpassen.

Tipp: Da Sie so viele Objekte, wie Sie möchten, hinzufügen können, sollten Sie DynamicAppearance mit der aktivierten Option Entwurfsmodus umschalten verwenden.

Verwenden des Werts "Custom"

Mit der Auswahl des Custom-Darstellungswerts aktiviert die folgenden Objekte in der Elementdarstellung:

CustomValueStructure.png

Um die Sichtbarkeit des gewünschten Objekts zu setzen:

  • Aktivieren Sie die Eigenschaft Visible (durch Setzen dessen Werts auf True) im Objektinspektors für jedes der gewünschten Objekte und ändern Sie die Eigenschaften Ihren Anforderungen entsprechend.
  • Aktivieren Sie die Eigenschaft Visible für jedes der Objekte, indem Sie sie auf True im Quelltext setzen.
Delphi: 
AItem.Objects.AccessoryObject.Visible := True;
C++: 
void __fastcall TForm1::SetEditItemProperties( TItemAppearanceObjects * AObjects)
{
	AObjects->GlyphButton->Visible = true;
}

Entwurfsmodus

Im Entwurfsmodus können Sie das Eintragserscheinungsbild einer ListView zur Entwurfszeit visuell anpassen. Sie können diesen Modus für jede der ItemAppearance-Eigenschaften (Custom, DynamicAppearance, ListItem, ImageListItem usw.) anpassen.

Tipp: Wenn DynamicAppearance ausgewählt ist, sollten Sie den Entwurfsmodus verwenden, weil DynamicAppearance das freie Anpassen von ItemAppearance ermöglicht.

Um den Entwurfsmodus zu aktivieren, klicken Sie in der Strukturansicht oder im Formular-Designer mit der rechten Maustaste auf das TListView-Objekt und wählen den Befehl Entwurfsmodus umschalten aus. Der Befehl Entwurfsmodus umschalten ändert die Entwurfszeitansicht des ListView-Objekts von einem leeren Feld in eine Designvorschau des ListView-Eintrags. Anschließend können Sie:

  • Die Darstellung des Eintrags im Formular visuell anpassen.
  • Die Änderungen, die Sie der Eintragsdarstellung durchführen, im Objektinspektor anzeigen.
ToggleDesignMode.png

Erstellen einer angepassten Darstellungsklasse

Sie können eine neue angepasste Darstellungsklasse erstellen und installieren und in Ihrem Design verwenden, indem Sie ein neues Package installieren. In diesem Package sind die Klassen definiert, die eine benutzerdefinierte Darstellung für Einträge in Listenansichten implementieren. Sie können die Felder bei Bedarf anpassen, um beispielsweise ein Bewertungsbild (ein Steuerelement, das abhängig von einem numerischen Wert unterschiedliche Bilder anzeigt) zu implementieren.

Verwenden der angepassten Darstellungsklasse

  1. Implementieren Sie ein neues TListView-Darstellungs-Package. Die folgenden Beispiele enthalten verschiedene Beispiele, die die anzuzeigende Listenansichtsdarstellung anpassen:
  2. Installieren Sie das angepasste Darstellungs-Package in der IDE.
  3. Nach der Installation kann die neue Darstellung mit einer TListView-Komponente im Objektinspektor verwendet werden.

CustomizedAppearancePackage.png

Hinweis: Der Wert MultiDetailItem steht für ein angepasstes Darstellungs-Package, das früher in der IDE installiert wurde.

Siehe auch

Beispiele

Abgerufen von „https://docwiki.embarcadero.com/RADStudio/Tokyo/d/index.php?title=Anpassen_der_Darstellung_von_FireMonkey-Listenansichten&oldid=210144“