ListView
Die .NET Multi-Platform App UI (.NET MAUI) ListView zeigt eine bildlauffähige vertikale Liste von auswählbaren Datenelementen an. Während ListView die Darstellung der Liste verwaltet wird, wird die Darstellung jedes Elements in der Liste durch ein DataTemplate Element definiert, das zum Cell Anzeigen von Elementen verwendet wird. .NET MAUI enthält Zelltypen zum Anzeigen von Text- und Bildkombinationen, und Sie können auch benutzerdefinierte Zellen definieren, die beliebige Inhalte anzeigen. ListView enthält auch Unterstützung für die Anzeige von Kopf- und Fußzeilen, gruppierte Daten, Aktualisierung durch Ziehen und Kontextmenüelemente.
Die ListView Klasse wird von der Klasse abgeleitet, von der ItemsView<Cell>
sie die folgenden Eigenschaften erbt:
ItemsSource
, vom TypIEnumerable
, gibt die Auflistung der anzuzeigenden Elemente an und hat einen Standardwert vonnull
.ItemTemplate
, vom Typ DataTemplate, gibt die Vorlage an, die auf jedes Element in der Auflistung der anzuzeigenden Elemente angewendet werden soll.
ListView definiert die folgenden Eigenschaften:
Footer
, vom Typobject
, gibt die Zeichenfolge oder Ansicht an, die am Ende der Liste angezeigt wird.FooterTemplate
, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren derFooter
.GroupHeaderTemplate
, vom Typ DataTemplate, definiert die DataTemplate zum Definieren der Darstellung der Kopfzeile jeder Gruppe verwendet. Diese Eigenschaft schließt sich gegenseitig mit derGroupDisplayBinding
Eigenschaft aus. Daher wirdGroupDisplayBinding
die Einstellung dieser Eigenschaft aufnull
.HasUnevenRows
, vom Typbool
, gibt an, ob Elemente in der Liste Zeilen mit unterschiedlichen Höhen enthalten können. Der Standardwert dieser Eigenschaft istfalse
.Header
, vom Typobject
, gibt die Zeichenfolge oder Ansicht an, die am Anfang der Liste angezeigt wird.HeaderTemplate
, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren derHeader
.HorizontalScrollBarVisibility
, vom TypScrollBarVisibility
, gibt an, wann die horizontale Bildlaufleiste sichtbar ist.IsGroupedEnabled
, vom Typbool
, gibt an, ob die zugrunde liegenden Daten in Gruppen angezeigt werden sollen. Der Standardwert dieser Eigenschaft istfalse
.IsPullToRefreshEnabled
, vom Typbool
, gibt an, ob der Benutzer nach unten wischen kann, um die ListView Daten zu aktualisieren. Der Standardwert dieser Eigenschaft istfalse
.IsRefreshing
, vom Typbool
, gibt an, ob die ListView aktuelle Aktualisierung erfolgt. Der Standardwert dieser Eigenschaft istfalse
.RefreshCommand
, vom Typ ICommand, stellt den Befehl dar, der ausgeführt wird, wenn eine Aktualisierung ausgelöst wird.RefreshControlColor
, vom Typ Color, bestimmt die Farbe der Aktualisierungsvisualisierung, die angezeigt wird, während eine Aktualisierung auftritt.RowHeight
, vom Typint
, bestimmt die Höhe jeder Zeile, wennHasUnevenRows
dies istfalse
.SelectedItem
, vom Typobject
, stellt das aktuell ausgewählte Element in der ListView.SelectionMode
, vom TypListViewSelectionMode
, gibt an, ob Elemente in der ListView oder nicht ausgewählt werden können. Der Standardwert dieser Eigenschaft istSingle
.SeparatorColor
, vom Typ Color, definiert die Farbe der Leiste, die Elemente in der Liste trennt.SeparatorVisibility
, vom TypSeparatorVisibility
, definiert, ob Trennzeichen zwischen Elementen sichtbar sind.VerticalScrollBarVisibility
, vom TypScrollBarVisibility
, gibt an, wann die vertikale Bildlaufleiste sichtbar ist.
Alle diese Eigenschaften werden von BindableProperty Objekten unterstützt, was bedeutet, dass sie Ziele von Datenbindungen sein können und formatiert werden können.
Darüber hinaus werden die folgenden Eigenschaften definiert, ListView die nicht von BindableProperty Objekten unterstützt werden:
GroupDisplayBinding
, vom TypBindingBase
, die Bindung, die für die Anzeige der Gruppenkopf verwendet werden soll. Diese Eigenschaft schließt sich gegenseitig mit derGroupHeaderTemplate
Eigenschaft aus. Daher wirdGroupHeaderTemplate
die Einstellung dieser Eigenschaft aufnull
.GroupShortNameBinding
, vom TypBindingBase
, die Bindung für den Namen, der in gruppierten Sprunglisten angezeigt werden soll.CachingStrategy
, vom TypListViewCachingStrategy
, definiert die Wiederverwendungsstrategie der Zelle .ListView Dies ist eine schreibgeschützte Eigenschaft.
ListView definiert die folgenden Ereignisse:
ItemAppearing
wird ausgelöst, wenn die visuelle Darstellung eines Elements dem visuellen Layout des Elements ListViewhinzugefügt wird. DasItemVisibilityEventArgs
Objekt, das dieses Ereignis begleitet, definiertItem
undIndex
eigenschaften.ItemDisappearing
wird ausgelöst, wenn die visuelle Darstellung eines Elements aus dem visuellen Layout des Elements ListViewentfernt wird. DasItemVisibilityEventArgs
Objekt, das dieses Ereignis begleitet, definiertItem
undIndex
eigenschaften.ItemSelected
wird ausgelöst, wenn ein neues Element in der Liste ausgewählt wird. DasSelectedItemChangedEventArgs
Objekt, das dieses Ereignis begleitet, definiertSelectedItem
undSelectedItemIndex
eigenschaften.ItemTapped
, der ausgelöst wird, wenn ein Element in der ListView Koppelung angetippt wird. DasItemTappedEventArgs
Objekt, das dieses Ereignis begleitet, definiertGroup
,Item
undItemIndex
Eigenschaften.Refreshing
wird ausgelöst, wenn ein Aktualisierungsvorgang durch Ziehen ausgelöst ListViewwird.Scrolled
, . DasScrolledEventArgs
Objekt, das dieses Ereignis begleitet, definiertScrollX
undScrollY
eigenschaften.ScrollToRequested
. DasScrollToRequestedEventArgs
Objekt, das dieses Ereignis begleitet, definiert Element, ,Mode
,Position
, ,ScrollX
undShouldAnimate
ScrollY
Eigenschaften.
Auffüllen eines ListView-Steuerelements mit Daten
A ListView wird mit Daten aufgefüllt, indem die ItemsSource
Eigenschaft auf eine beliebige Auflistung festgelegt wird, die implementiert wird IEnumerable
.
Wichtig
Wenn die ListView Aktualisierung erforderlich ist, wenn Elemente hinzugefügt, entfernt oder in der zugrunde liegenden Auflistung geändert werden, sollte die zugrunde liegende Auflistung eine IEnumerable
Auflistung sein, die Benachrichtigungen zu Eigenschaftsänderungsbenachrichtigungen sendet, z ObservableCollection
. B. . .
ListView kann mit Daten aufgefüllt werden, indem die Datenbindung verwendet wird, um die ItemsSource
Eigenschaft an eine IEnumerable
Auflistung zu binden. In XAML wird dies mit der Binding
Markuperweiterung erreicht:
<ListView ItemsSource="{Binding Monkeys}" />
Der entsprechende C#-Code lautet:
ListView listView = new ListView();
listView.SetBinding(ItemsView.ItemsSourceProperty, "Monkeys");
In diesem Beispiel werden die ItemsSource
Eigenschaftendaten an die Monkeys
Eigenschaft des verbundenen Ansichtsmodells gebunden.
Hinweis
Kompilierte Bindungen können aktiviert werden, um die Datenbindungsleistung in .NET MAUI-Anwendungen zu verbessern. Weitere Informationen finden Sie unter Kompilierte Bindungen.
Weitere Informationen zur Datenbindung finden Sie unter "Datenbindung".
Definieren der Elementdarstellung
Die Darstellung der einzelnen Elemente in der ListView Datei kann durch Festlegen der ItemTemplate
Eigenschaft auf folgendes DataTemplatedefiniert werden:
<ListView ItemsSource="{Binding Monkeys}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Grid.RowSpan="2"
Source="{Binding ImageUrl}"
Aspect="AspectFill"
HeightRequest="60"
WidthRequest="60" />
<Label Grid.Column="1"
Text="{Binding Name}"
FontAttributes="Bold" />
<Label Grid.Row="1"
Grid.Column="1"
Text="{Binding Location}"
FontAttributes="Italic"
VerticalOptions="End" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Die in der DataTemplate Definition der Darstellung der einzelnen Elemente in der Liste angegebenen Elemente und das untergeordnete Element des DataTemplate Elements müssen ein Cell Objekt sein. Im Beispiel wird das Layout innerhalb des DataTemplate Steuerelements von einem Grid. Das Grid Objekt enthält ein Image Objekt und zwei Label Objekte, die alle an Eigenschaften der Monkey
Klasse gebunden sind:
public class Monkey
{
public string Name { get; set; }
public string Location { get; set; }
public string Details { get; set; }
public string ImageUrl { get; set; }
}
Der folgende Screenshot zeigt das Ergebnis der Vorlagen für jedes Element in der Liste:
Weitere Informationen zu Datenvorlagen finden Sie unter "Datenvorlagen".
Zellen
Die Darstellung der einzelnen Elemente in einem ListView Element wird durch ein DataTemplateElement definiert, und die DataTemplate muss auf eine Cell Klasse verweisen, um Elemente anzuzeigen. Jede Zelle stellt ein Datenelement in der ListView. .NET MAUI enthält die folgenden integrierten Zellen:
- TextCell, der primärer und sekundärer Text in separaten Zeilen anzeigt.
- ImageCell, das ein Bild mit primärem und sekundären Text in separaten Zeilen anzeigt.
- SwitchCell, der Text und einen Schalter anzeigt, der ein- oder ausgeschaltet werden kann.
- EntryCell, in dem eine Beschriftung und ein Beschriftungstext angezeigt werden, der bearbeitbar ist.
- ViewCell, die eine benutzerdefinierte Zelle ist, deren Darstellung durch eine View. Dieser Zelltyp sollte verwendet werden, wenn Sie die Darstellung der einzelnen Elemente in einem Vollständig ListViewdefinieren möchten.
SwitchCellEntryCell In der Regel und wird nur in einer TableView und nicht in einer ListViewverwendet. Weitere Informationen zu SwitchCell und EntryCell, finden Sie unter TableView.
Textzelle
In einem TextCell Text werden primärer und sekundärer Text in separaten Zeilen angezeigt. TextCell definiert die folgenden Eigenschaften:
Text
, vom Typstring
, definiert den primären Text, der angezeigt werden soll.TextColor
, vom Typ Color, stellt die Farbe des primären Texts dar.Detail
, vom Typstring
, definiert den sekundären Text, der angezeigt werden soll.DetailColor
, vom Typ Color, gibt die Farbe des sekundären Texts an.Command
, vom Typ ICommand, definiert den Befehl, der beim Tippen auf die Zelle ausgeführt wird.CommandParameter
, vom Typobject
, stellt den Parameter dar, der an den Befehl übergeben wird.
Diese Eigenschaften werden durch BindableProperty-Objekte gestützt, was bedeutet, dass sie Ziele von Datenbindungen sein können, und geformt.
Das folgende Beispiel zeigt die Verwendung einer TextCell Zum Definieren der Darstellung von Elementen in einer ListView:
<ListView ItemsSource="{Binding Food}">
<ListView.ItemTemplate>
<DataTemplate>
<TextCell Text="{Binding Name}"
Detail="{Binding Description}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Der folgende Screenshot zeigt die resultierende Zellendarstellung:
Bildzelle
Ein ImageCell Bild zeigt ein Bild mit primärem und sekundären Text in separaten Zeilen an. ImageCell erbt die Eigenschaften von TextCell, und definiert die ImageSource Eigenschaft vom Typ ImageSource, die angibt, das Bild in der Zelle angezeigt werden soll. Diese Eigenschaft wird durch ein BindableProperty Objekt gesichert, was bedeutet, dass es das Ziel von Datenbindungen sein kann und formatiert werden kann.
Das folgende Beispiel zeigt die Verwendung eines Elements ImageCell zum Definieren der Darstellung von Elementen in einer ListView:
<ListView ItemsSource="{Binding Food}">
<ListView.ItemTemplate>
<DataTemplate>
<ImageCell ImageSource="{Binding Image}"
Text="{Binding Name}"
Detail="{Binding Description}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Der folgende Screenshot zeigt die resultierende Zellendarstellung:
Zelle anzeigen
A ViewCell ist eine benutzerdefinierte Zelle, deren Darstellung durch eine View. ViewCell definiert eine View Eigenschaft vom Typ View, die die Ansicht definiert, die den Inhalt der Zelle darstellt. Diese Eigenschaft wird durch ein BindableProperty Objekt gesichert, was bedeutet, dass es das Ziel von Datenbindungen sein kann und formatiert werden kann.
Hinweis
Die View-Eigenschaft ist die Inhaltseigenschaft der ViewCell-Klasse und muss daher nicht explizit in XAML festgelegt werden.
Das folgende Beispiel zeigt die Verwendung einer ViewCell Zum Definieren der Darstellung von Elementen in einer ListView:
<ListView ItemsSource="{Binding Monkeys}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Grid.RowSpan="2"
Source="{Binding ImageUrl}"
Aspect="AspectFill"
HeightRequest="60"
WidthRequest="60" />
<Label Grid.Column="1"
Text="{Binding Name}"
FontAttributes="Bold" />
<Label Grid.Row="1"
Grid.Column="1"
Text="{Binding Location}"
FontAttributes="Italic"
VerticalOptions="End" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Innerhalb des ViewCellLayouts kann jedes .NET MAUI-Layout verwaltet werden. In diesem Beispiel wird das Layout von einem Grid. Das Grid Objekt enthält ein Image Objekt und zwei Label Objekte, die alle an Eigenschaften der Monkey
Klasse gebunden sind.
Der folgende Screenshot zeigt das Ergebnis der Vorlagen für jedes Element in der Liste:
Auswählen der Elementdarstellung zur Laufzeit
Die Darstellung jedes Elements in der ListView Zelle kann zur Laufzeit ausgewählt werden, basierend auf dem Elementwert, indem die ItemTemplate
Eigenschaft auf ein DataTemplateSelector Objekt festgelegt wird:
<ContentPage ...
xmlns:templates="clr-namespace:ListViewDemos.Templates">
<ContentPage.Resources>
<DataTemplate x:Key="AmericanMonkeyTemplate">
<ViewCell>
...
</ViewCell>
</DataTemplate>
<DataTemplate x:Key="OtherMonkeyTemplate">
<ViewCell>
...
</ViewCell>
</DataTemplate>
<templates:MonkeyDataTemplateSelector x:Key="MonkeySelector"
AmericanMonkey="{StaticResource AmericanMonkeyTemplate}"
OtherMonkey="{StaticResource OtherMonkeyTemplate}" />
</ContentPage.Resources>
<StackLayout Margin="20">
<ListView ItemsSource="{Binding Monkeys}"
ItemTemplate="{StaticResource MonkeySelector}" />
</StackLayout>
</ContentPage>
Die ItemTemplate
Eigenschaft wird auf ein MonkeyDataTemplateSelector
Objekt festgelegt. Das folgende Beispiel zeigt die MonkeyDataTemplateSelector
Klasse:
public class MonkeyDataTemplateSelector : DataTemplateSelector
{
public DataTemplate AmericanMonkey { get; set; }
public DataTemplate OtherMonkey { get; set; }
protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
{
return ((Monkey)item).Location.Contains("America") ? AmericanMonkey : OtherMonkey;
}
}
Die MonkeyDataTemplateSelector
Klasse definiert AmericanMonkey
und OtherMonkey
DataTemplate Eigenschaften, die auf verschiedene Datenvorlagen festgelegt sind. Die OnSelectTemplate
Außerkraftsetzung gibt die AmericanMonkey
Vorlage zurück, die den Affennamen und die Position in Teal anzeigt, wenn der Affenname "Amerika" enthält. Wenn der Affenname nicht "Amerika" enthält, gibt die OnSelectTemplate
Überschreibung die OtherMonkey
Vorlage zurück, die den Affennamen und die Position in Silber anzeigt:
Weitere Informationen zu Datenvorlagenselektoren finden Sie unter Create a DataTemplateSelector.
Reagieren auf Elementauswahl
Standardmäßig ListView ist die Auswahl aktiviert. Dieses Verhalten kann jedoch durch Festlegen der SelectionMode
Eigenschaft geändert werden. Die ListViewSelectionMode
-Enumeration definiert die folgenden Member:
None
– gibt an, dass Elemente nicht ausgewählt werden können.Single
– gibt an, dass ein einzelnes Element ausgewählt werden kann, wobei das ausgewählte Element hervorgehoben ist. Dies ist der Standardwert.
ListView definiert ein ItemSelected
Ereignis, das ausgelöst wird, wenn sich die SelectedItem
Eigenschaft ändert, entweder aufgrund der Benutzer, die ein Element aus der Liste auswählen, oder wenn eine App die Eigenschaft festlegt. Das SelectedItemChangedEventArgs
Objekt, das dieses Ereignis begleitet, hat SelectedItem
und SelectedItemIndex
Eigenschaften.
Wenn die SelectionMode
Eigenschaft auf <SelectedItem
Eigenschaft auf den Wert des ausgewählten Elements festgelegt. Wenn sich diese Eigenschaft ändert, wird das ItemSelected
Ereignis ausgelöst.
Das folgende Beispiel zeigt ein ListView Element, das auf die Auswahl einzelner Elemente reagieren kann:
<ListView ItemsSource="{Binding Monkeys}"
ItemSelected="OnItemSelected">
...
</ListView>
In diesem Beispiel wird der OnItemSelected
Ereignishandler ausgeführt, wenn das ItemSelected
Ereignis ausgelöst wird, wobei der Ereignishandler das ausgewählte Element abruft:
void OnItemSelected(object sender, SelectedItemChangedEventArgs args)
{
Monkey item = args.SelectedItem as Monkey;
}
Der folgende Screenshot zeigt die Auswahl einzelner Elemente in einer ListView:
Löschen der Auswahl
Die SelectedItem
Eigenschaft kann gelöscht werden, indem Sie sie festlegen oder das Objekt, an das sie gebunden ist, an null
.
Auswahl deaktivieren
ListView Die Auswahl ist standardmäßig aktiviert. Sie kann jedoch deaktiviert werden, indem Sie die SelectionMode
Eigenschaft auf None
:
<ListView ...
SelectionMode="None" />
Wenn die SelectionMode
Eigenschaft auf <SelectedItem
Eigenschaft erneut Standard null
und das ItemSelected
Ereignis wird nicht ausgelöst.
Daten zwischenspeichern
ListView ist eine leistungsstarke Ansicht zum Anzeigen von Daten, hat jedoch einige Einschränkungen. Die Bildlaufleistung kann bei der Verwendung von benutzerdefinierten Zellen leiden, insbesondere wenn sie tief geschachtelte Ansichtshierarchien enthalten oder bestimmte Layouts verwenden, die eine komplexe Messung erfordern. Glücklicherweise gibt es Techniken, mit denen Sie eine schlechte Leistung vermeiden können.
A ListView wird häufig verwendet, um viel mehr Daten anzuzeigen, als auf dem Bildschirm passt. Eine Musik-App kann z. B. eine Bibliothek mit Songs mit Tausenden von Einträgen enthalten. Das Erstellen eines Elements für jeden Eintrag würde wertvollen Arbeitsspeicher verschwenden und schlecht ausgeführt werden. Das Erstellen und Zerstören von Zeilen würde erfordern, dass die App objekte ständig instanziieren und sauber, was auch schlecht ausgeführt würde.
Um Arbeitsspeicher zu sparen, verfügen die systemeigenen ListView Entsprechungen für jede Plattform über integrierte Features zum Wiederverwenden von Zeilen. Nur die auf dem Bildschirm sichtbaren Zellen werden im Arbeitsspeicher geladen, und der Inhalt wird in vorhandene Zellen geladen. Dieses Muster verhindert, dass die App Tausende von Objekten instanziiert und Zeit und Arbeitsspeicher spart.
.NET MAUI ermöglicht ListView die Wiederverwendung der Zelle über die ListViewCachingStrategy
Enumeration, die die folgenden Member definiert:
RetainElement
gibt an, dass die ListView Zelle für jedes Element in der Liste generiert wird.RecycleElement
, gibt an, dass der ListView Versuch versucht, den Speicherbedarf und die Ausführungsgeschwindigkeit durch Recycling von Listenzellen zu minimieren.RecycleElementAndDataTemplate
, währendRecycleElement
gleichzeitig sichergestellt wird, dass bei Verwendung eines DataTemplateSelectorListView Objekts DataTemplate Objekte vom Typ des Elements in der Liste zwischengespeichert werden.
Beibehalten von Elementen
Die RetainElement
Zwischenspeicherungsstrategie gibt an, dass die ListView Zelle für jedes Element in der Liste generiert und das Standardverhalten ListView ist. Es sollte unter folgenden Umständen verwendet werden:
- Jede Zelle weist eine große Anzahl von Bindungen auf (20-30+).
- Die Zellenvorlage ändert sich häufig.
- Tests zeigen, dass die
RecycleElement
Zwischenspeicherungsstrategie zu einer reduzierten Ausführungsgeschwindigkeit führt.
Es ist wichtig, die Folgen der RetainElement
Zwischenspeicherungsstrategie beim Arbeiten mit benutzerdefinierten Zellen zu erkennen. Jeder Zellinitialisierungscode muss für jede Zellenerstellung ausgeführt werden, die möglicherweise mehrmals pro Sekunde sein kann. In diesem Fall werden Layouttechniken, die auf einer Seite einwandfrei waren, z. B. die Verwendung mehrerer geschachtelter StackLayout Objekte, zu Leistungsengpässen, wenn sie in Echtzeit eingerichtet und zerstört werden, während der Benutzer scrollt.
Wiederverwenden von Elementen
Die RecycleElement
Zwischenspeicherungsstrategie gibt an, dass der ListView Versuch versucht, den Speicherbedarf und die Ausführungsgeschwindigkeit durch Recycling von Listenzellen zu minimieren. Dieser Modus bietet nicht immer eine Leistungsverbesserung, und Tests sollten durchgeführt werden, um Verbesserungen zu ermitteln. Es ist jedoch die bevorzugte Wahl und sollte unter den folgenden Umständen verwendet werden:
- Jede Zelle weist eine kleine bis moderate Anzahl von Bindungen auf.
- Jede Zelle
BindingContext
definiert alle Zelldaten. - Jede Zelle ist weitgehend ähnlich, wobei die Zellenvorlage unverändert bleibt.
Während der Virtualisierung wird der Bindungskontext aktualisiert, und wenn eine App diesen Modus verwendet, muss sichergestellt werden, dass Bindungskontextaktualisierungen ordnungsgemäß behandelt werden. Alle Daten zur Zelle müssen aus dem Bindungskontext oder Konsistenzfehlern stammen. Dieses Problem kann vermieden werden, indem die Datenbindung zum Anzeigen von Zelldaten verwendet wird. Alternativ sollten Zelldaten in der OnBindingContextChanged
Außerkraftsetzung und nicht im Konstruktor der benutzerdefinierten Zelle festgelegt werden, wie im folgenden Beispiel gezeigt:
public class CustomCell : ViewCell
{
Image image = null;
public CustomCell()
{
image = new Image();
View = image;
}
protected override void OnBindingContextChanged()
{
base.OnBindingContextChanged();
var item = BindingContext as ImageItem;
if (item != null)
{
image.Source = item.ImageUrl;
}
}
}
Wiederverwenden von Elementen mit einem DataTemplateSelector
Wenn eine zum Auswählen einer ListViewDataTemplateSelector Zwischenspeicherungsstrategie DataTemplateverwendet wird, RecycleElement
werden keine Objekte zwischengespeichert DataTemplate . Stattdessen wird ein DataTemplate Element der Daten in der Liste ausgewählt.
Hinweis
Für die RecycleElement
Zwischenspeicherungsstrategie ist erforderlich, wenn ein DataTemplateSelector Benutzer aufgefordert wird, einen DataTemplate Typ auszuwählen, der jeweils DataTemplate denselben ViewCell Typ zurückgeben muss. Beispielsweise kann ein Wert mit einem ListViewDataTemplateSelector Wert zurückgegeben werden, der entweder MyDataTemplateA
(wobei MyDataTemplateA
ein ViewCell Typ MyViewCellA
zurückgegeben wird) oder MyDataTemplateB
(wobei MyDataTemplateB
ein ViewCell Typ MyViewCellB
zurückgegeben wird) zurückgegeben werden muss, wenn MyDataTemplateA
er zurückgegeben MyViewCellA
wird oder eine Ausnahme ausgelöst wird.
Wiederverwenden von Elementen mit DataTemplates
Die RecycleElementAndDataTemplate
Zwischenspeicherungsstrategie baut auf der RecycleElement
Zwischenspeicherungsstrategie auf, indem zusätzlich sichergestellt wird, dass Objekte, wenn eine ListViewDataTemplateSelector zum Auswählen eines DataTemplateElements verwendet wird, DataTemplate vom Typ des Elements in der Liste zwischengespeichert werden. DataTemplate Daher werden Objekte einmal pro Elementtyp und nicht einmal pro Elementinstanz ausgewählt.
Hinweis
Die RecycleElementAndDataTemplate
Zwischenspeicherungsstrategie setzt voraus, dass objekte, DataTemplate die DataTemplateSelector vom Konstruktor zurückgegeben werden, der DataTemplate eine Type
.
Festlegen der Zwischenspeicherungsstrategie
Die ListView Zwischenspeicherungsstrategie kann in XAML durch Festlegen des CachingStrategy
Attributs definiert werden:
<ListView CachingStrategy="RecycleElement">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
...
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
In C# wird die Zwischenspeicherungsstrategie über eine Konstruktorüberladung festgelegt:
ListView listView = new ListView(ListViewCachingStrategy.RecycleElement);
Festlegen der Zwischenspeicherungsstrategie in einer unterklassigten ListView
Wenn Sie das CachingStrategy
Attribut aus XAML für eine Unterklasse ListView festlegen, wird das gewünschte Verhalten nicht erzeugt, da keine CachingStrategy
Eigenschaft vorhanden ListViewist. Die Lösung für dieses Problem besteht darin, einen Konstruktor für die Unterklasse ListView anzugeben, der einen ListViewCachingStrategy
Parameter akzeptiert und an die Basisklasse übergibt:
public class CustomListView : ListView
{
public CustomListView (ListViewCachingStrategy strategy) : base (strategy)
{
}
...
}
Anschließend kann der Enumerationswert mithilfe des ListViewCachingStrategy
x:Arguments
Attributs aus XAML angegeben werden:
<local:CustomListView>
<x:Arguments>
<ListViewCachingStrategy>RecycleElement</ListViewCachingStrategy>
</x:Arguments>
</local:CustomListView>
Kopf- und Fußzeilen
ListView kann eine Kopf- und Fußzeile darstellen, die mit den Elementen in der Liste scrollen. Die Kopf- und Fußzeile kann Zeichenfolgen, Ansichten oder DataTemplate Objekte sein.
ListView definiert die folgenden Eigenschaften zum Angeben der Kopf- und Fußzeile:
Header
, vom Typobject
, gibt die Zeichenfolge, Bindung oder Ansicht an, die am Anfang der Liste angezeigt wird.HeaderTemplate
, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren derHeader
.Footer
, vom Typobject
, gibt die Zeichenfolge, Bindung oder Ansicht an, die am Ende der Liste angezeigt wird.FooterTemplate
, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren derFooter
.
Diese Eigenschaften werden von BindableProperty Objekten gesichert, was bedeutet, dass die Eigenschaften Ziele von Datenbindungen sein können.
Anzeigen von Zeichenfolgen in der Kopf- und Fußzeile
Die Header
Eigenschaften Footer
können auf string
Werte festgelegt werden, wie im folgenden Beispiel gezeigt:
<ListView ItemsSource="{Binding Monkeys}"
Header="Monkeys"
Footer="2022">
...
</ListView>
Der folgende Screenshot zeigt die resultierende Kopfzeile:
Anzeigen von Ansichten in der Kopf- und Fußzeile
Die Header
eigenschaften Footer
können jeweils auf eine Ansicht festgelegt werden. Dies kann eine einzelne Ansicht oder eine Ansicht sein, die mehrere untergeordnete Ansichten enthält. Das folgende Beispiel zeigt die Header
einzelnen Sätze und Footer
Eigenschaften auf ein StackLayout Objekt, das ein Label Objekt enthält:
<ListView ItemsSource="{Binding Monkeys}">
<ListView.Header>
<StackLayout BackgroundColor="LightGray">
<Label Margin="10,0,0,0"
Text="Monkeys"
FontSize="12"
FontAttributes="Bold" />
</StackLayout>
</ListView.Header>
<ListView.Footer>
<StackLayout BackgroundColor="LightGray">
<Label Margin="10,0,0,0"
Text="Friends of Monkey"
FontSize="12"
FontAttributes="Bold" />
</StackLayout>
</ListView.Footer>
...
</ListView>
Der folgende Screenshot zeigt die resultierende Kopfzeile:
Anzeigen einer vorlagenbasierten Kopf- und Fußzeile
Die HeaderTemplate
Eigenschaften FooterTemplate
können auf DataTemplate Objekte festgelegt werden, die zum Formatieren der Kopf- und Fußzeile verwendet werden. In diesem Szenario müssen die Eigenschaften und Footer
Die Header
Eigenschaften an die aktuelle Quelle gebunden werden, damit die Vorlagen angewendet werden, wie im folgenden Beispiel gezeigt:
<ListView ItemsSource="{Binding Monkeys}"
Header="{Binding .}"
Footer="{Binding .}">
<ListView.HeaderTemplate>
<DataTemplate>
<StackLayout BackgroundColor="LightGray">
<Label Margin="10,0,0,0"
Text="Monkeys"
FontSize="12"
FontAttributes="Bold" />
</StackLayout>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.FooterTemplate>
<DataTemplate>
<StackLayout BackgroundColor="LightGray">
<Label Margin="10,0,0,0"
Text="Friends of Monkey"
FontSize="12"
FontAttributes="Bold" />
</StackLayout>
</DataTemplate>
</ListView.FooterTemplate>
...
</ListView>
Steuerelementelementtrennzeichen
Standardmäßig werden Trennzeichen zwischen Elementen unter ListView iOS und Android angezeigt. Dieses Verhalten kann geändert werden, indem sie die SeparatorVisibility
Eigenschaft des Typs SeparatorVisibility
auf :None
<ListView ...
SeparatorVisibility="None" />
Wenn das Trennzeichen aktiviert ist, kann die Farbe mit der SeparatorColor
Eigenschaft festgelegt werden:
<ListView ...
SeparatorColor="Blue" />
Größe von Elementen
Standardmäßig weisen alle Elemente in einer ListView Höhe dieselbe Höhe auf, die vom Inhalt des DataTemplate Elements abgeleitet wird, das die Darstellung jedes Elements definiert. Dieses Verhalten kann jedoch mit den HasUnevenRows
Eigenschaften geändert RowHeight
werden. Standardmäßig ist false
die HasUnevenRows
Eigenschaft .
Die RowHeight
Eigenschaft kann auf eine int
Eigenschaft festgelegt werden, die die Höhe der einzelnen Elemente im ListView, vorausgesetzt, das HasUnevenRows
ist false
. Wenn HasUnevenRows
sie auf <
Einzelne ListView Elemente können zur Laufzeit programmgesteuert geändert werden, indem layoutbezogene Eigenschaften von Elementen innerhalb des DataTemplateElements geändert werden, vorausgesetzt, die HasUnevenRows
Eigenschaft ist true
. Im folgenden Beispiel wird die Höhe eines Image Objekts geändert, wenn es angetippt wird:
void OnImageTapped(object sender, EventArgs args)
{
Image image = sender as Image;
ViewCell viewCell = image.Parent.Parent as ViewCell;
if (image.HeightRequest < 250)
{
image.HeightRequest = image.Height + 100;
viewCell.ForceUpdateSize();
}
}
In diesem Beispiel wird der OnImageTapped
Ereignishandler als Reaktion auf ein Image Objekt ausgeführt, auf das getippt wird. Der Ereignishandler aktualisiert die Höhe der Image Zelle, und die Cell.ForceUpdateSize
Methode aktualisiert die Größe der Zelle, auch wenn sie derzeit nicht sichtbar ist.
Warnung
Die Übermäßige Verwendung der Größe dynamischer Elemente kann dazu führen ListView , dass die Leistung beeinträchtigt wird.
Layout von rechts nach links
ListView kann den Inhalt in einer Flussrichtung von rechts nach links layouten, indem seine FlowDirection
Eigenschaft auf " RightToLeft
festgelegt wird. FlowDirection
Die Eigenschaft sollte jedoch idealerweise auf einem Seiten- oder Stammlayout festgelegt werden, was dazu führt, dass alle Elemente innerhalb der Seite oder im Stammlayout auf die Flussrichtung reagieren:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ListViewDemos.RightToLeftListPage"
Title="Right to left list"
FlowDirection="RightToLeft">
<StackLayout Margin="20">
<ListView ItemsSource="{Binding Monkeys}">
...
</ListView>
</StackLayout>
</ContentPage>
Der Standardwert FlowDirection
für ein Element mit einem übergeordneten Element ist MatchParent
. Daher erbt der ListViewFlowDirection
Eigenschaftswert vom StackLayout, was wiederum den FlowDirection
Eigenschaftswert von der ContentPage.
Gruppierte Daten anzeigen
Große Datasets können häufig unübersichtlich werden, wenn sie in einer fortlaufenden Bildlaufliste angezeigt werden. In diesem Szenario kann das Organisieren der Daten in Gruppen die Benutzererfahrung verbessern, indem die Navigation in die Daten vereinfacht wird.
Die Daten müssen gruppiert werden, bevor sie angezeigt werden können. Dies kann durch Erstellen einer Liste von Gruppen erreicht werden, wobei jede Gruppe eine Liste von Elementen ist. Die Liste der Gruppen sollte eine IEnumerable<T>
Sammlung sein, in der T
zwei Datenabschnitte definiert werden:
- Ein Gruppenname.
- Eine
IEnumerable
Auflistung, die die Elemente definiert, die zur Gruppe gehören.
Der Prozess zum Gruppieren von Daten besteht daher in folgendem Zusammenhang:
- Erstellen Sie einen Typ, der ein einzelnes Element modelliert.
- Erstellen Sie einen Typ, der eine einzelne Gruppe von Elementen modelliert.
- Erstellen Sie eine
IEnumerable<T>
Auflistung, wobeiT
es sich um den Typ handelt, der eine einzelne Gruppe von Elementen modelliert. Diese Sammlung ist eine Sammlung von Gruppen, die die gruppierten Daten speichern. - Fügen Sie der
IEnumerable<T>
Sammlung Daten hinzu.
Beispiel
Beim Gruppieren von Daten besteht der erste Schritt darin, einen Typ zu erstellen, der ein einzelnes Element modelliert. Das folgende Beispiel zeigt die Animal
Klasse:
public class Animal
{
public string Name { get; set; }
public string Location { get; set; }
public string Details { get; set; }
public string ImageUrl { get; set; }
}
Die Animal
Klasse modelliert ein einzelnes Element. Ein Typ, der eine Gruppe von Elementen modelliert, kann dann erstellt werden. Das folgende Beispiel zeigt die AnimalGroup
Klasse:
public class AnimalGroup : List<Animal>
{
public string Name { get; private set; }
public AnimalGroup(string name, List<Animal> animals) : base(animals)
{
Name = name;
}
}
Die AnimalGroup
Klasse erbt von der List<T>
Klasse und fügt eine Name
Eigenschaft hinzu, die den Gruppennamen darstellt.
Anschließend kann eine IEnumerable<T>
Sammlung von Gruppen erstellt werden:
public List<AnimalGroup> Animals { get; private set; } = new List<AnimalGroup>();
Dieser Code definiert eine Auflistung namens Animals
, wobei jedes Element in der Auflistung ein AnimalGroup
Objekt ist. Jedes AnimalGroup
Objekt besteht aus einem Namen und einer List<Animal>
Auflistung, die die Animal
Objekte in der Gruppe definiert.
Gruppierte Daten können dann der Animals
Sammlung hinzugefügt werden:
Animals.Add(new AnimalGroup("Bears", new List<Animal>
{
new Animal
{
Name = "American Black Bear",
Location = "North America",
Details = "Details about the bear go here.",
ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/0/08/01_Schwarzbär.jpg"
},
new Animal
{
Name = "Asian Black Bear",
Location = "Asia",
Details = "Details about the bear go here.",
ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG/180px-Ursus_thibetanus_3_%28Wroclaw_zoo%29.JPG"
},
// ...
}));
Animals.Add(new AnimalGroup("Monkeys", new List<Animal>
{
new Animal
{
Name = "Baboon",
Location = "Africa & Asia",
Details = "Details about the monkey go here.",
ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Papio_anubis_%28Serengeti%2C_2009%29.jpg/200px-Papio_anubis_%28Serengeti%2C_2009%29.jpg"
},
new Animal
{
Name = "Capuchin Monkey",
Location = "Central & South America",
Details = "Details about the monkey go here.",
ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/4/40/Capuchin_Costa_Rica.jpg/200px-Capuchin_Costa_Rica.jpg"
},
new Animal
{
Name = "Blue Monkey",
Location = "Central and East Africa",
Details = "Details about the monkey go here.",
ImageUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/83/BlueMonkey.jpg/220px-BlueMonkey.jpg"
},
// ...
}));
Dieser Code erstellt zwei Gruppen in der Animals
Auflistung. Der erste AnimalGroup
ist benannt Bears
und enthält eine List<Animal>
Sammlung von Bärendetails. Die zweite AnimalGroup
ist benannt Monkeys
und enthält eine List<Animal>
Sammlung von Affendetails.
ListView zeigt gruppierte Daten an, vorausgesetzt, die Daten wurden ordnungsgemäß gruppiert, indem sie die IsGroupingEnabled
Eigenschaft auf true
:
<ListView ItemsSource="{Binding Animals}"
IsGroupingEnabled="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Image Grid.RowSpan="2"
Source="{Binding ImageUrl}"
Aspect="AspectFill"
HeightRequest="60"
WidthRequest="60" />
<Label Grid.Column="1"
Text="{Binding Name}"
FontAttributes="Bold" />
<Label Grid.Row="1"
Grid.Column="1"
Text="{Binding Location}"
FontAttributes="Italic"
VerticalOptions="End" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Der entsprechende C#-Code lautet:
ListView listView = new ListView
{
IsGroupingEnabled = true
};
listView.SetBinding(ItemsView.ItemsSourceProperty, "Animals");
// ...
Das Erscheinungsbild der einzelnen Elemente in der Datei ListView wird durch Festlegen der ItemTemplate
Eigenschaft auf ein DataTemplate. Weitere Informationen finden Sie unter Definieren der Elementdarstellung.
Der folgende Screenshot zeigt die ListView Anzeige gruppierter Daten:
Hinweis
ListView Standardmäßig wird der Gruppenname im Gruppenkopf angezeigt. Dieses Verhalten kann durch Anpassen des Gruppenkopfs geändert werden.
Anpassen des Gruppenkopfs
Die Darstellung der einzelnen Gruppenkopfzeilen kann angepasst werden, indem sie die ListView.GroupHeaderTemplate
Eigenschaft auf ein DataTemplate:
<ListView ItemsSource="{Binding Animals}"
IsGroupingEnabled="True">
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
<Label Text="{Binding Name}"
BackgroundColor="LightGray"
FontSize="18"
FontAttributes="Bold" />
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
...
</ListView>
In diesem Beispiel wird jeder Gruppenkopf auf einen Label Gruppenkopf festgelegt, der den Gruppennamen anzeigt und für die andere Darstellungseigenschaften festgelegt sind. Der folgende Screenshot zeigt den angepassten Gruppenkopf:
Wichtig
Die GroupHeaderTemplate
Eigenschaft schließt sich gegenseitig mit der GroupDisplayBinding
Eigenschaft aus. Daher sollten beide Eigenschaften nicht festgelegt werden.
Gruppieren ohne Vorlagen
ListView kann ordnungsgemäß gruppierte Daten anzeigen, ohne die ItemTemplate
Eigenschaft auf folgendes DataTemplatefestzulegen:
<ListView ItemsSource="{Binding Animals}"
IsGroupingEnabled="true" />
In diesem Szenario können aussagekräftige Daten angezeigt werden, indem die ToString
Methode in dem Typ überschrieben wird, der ein einzelnes Element modelliert, und der Typ, der eine einzelne Gruppe von Elementen modelliert.
Steuern des Bildlaufs
ListView definiert zwei ScrollTo
Methoden, mit denen Elemente in die Ansicht gescrollt werden. Eine der Überladungen führt einen Bildlauf des angegebenen Elements in die Ansicht durch, während die andere das angegebene Element in der angegebenen Gruppe in der Ansicht scrollt. Beide Überladungen verfügen über zusätzliche Argumente, mit denen die genaue Position des Elements nach Abschluss des Bildlaufs angegeben werden kann und ob der Bildlauf animiert werden soll.
ListView definiert ein ScrollToRequested
Ereignis, das ausgelöst wird, wenn eine der ScrollTo
Methoden aufgerufen wird. Das ScrollToRequestedEventArgs
Objekt, das das ScrollToRequested
Ereignis begleitet, verfügt über viele Eigenschaften, einschließlich ShouldAnimate
, Element, , Mode
und Position
. Einige dieser Eigenschaften werden aus den in den ScrollTo
Methodenaufrufen angegebenen Argumenten festgelegt.
Darüber hinaus definiert ein Scrolled
Ereignis, das ausgelöst wird, um anzugeben, ListView dass ein Bildlauf aufgetreten ist. Das ScrolledEventArgs
Objekt, das das Scrolled
Ereignis begleitet, hat ScrollX
und ScrollY
Eigenschaften.
Erkennen des Bildlaufs
ListView definiert ein Scrolled
Ereignis, das ausgelöst wird, um anzugeben, dass ein Bildlauf aufgetreten ist. Die ItemsViewScrolledEventArgs
Klasse, die das Objekt darstellt, das das Scrolled
Ereignis begleitet, definiert die folgenden Eigenschaften:
ScrollX
, vom Typdouble
, stellt die X-Position des Bildlaufs dar.ScrollY
, vom Typdouble
, stellt die Y-Position des Bildlaufs dar.
Im folgenden XAML-Beispiel wird ein ListView Ereignishandler für das Scrolled
Ereignis festgelegt:
<ListView Scrolled="OnListViewScrolled">
...
</ListView>
Der entsprechende C#-Code lautet:
ListView listView = new ListView();
listView.Scrolled += OnListViewScrolled;
In diesem Codebeispiel wird der OnListViewScrolled
Ereignishandler ausgeführt, wenn das Scrolled
Ereignis ausgelöst wird:
void OnListViewScrolled(object sender, ScrolledEventArgs e)
{
// Custom logic
}
Wichtig
Das Scrolled
Ereignis wird für vom Benutzer initiierte Bildläufe und für programmgesteuerte Bildläufe ausgelöst.
Scrollen eines Elements in die Ansicht
Die ScrollTo
Methode führt einen Bildlauf des angegebenen Elements in die Ansicht durch. Bei einem ListView Objekt mit dem Namen listView
zeigt das folgende Beispiel, wie das Proboscis Monkey-Element in die Ansicht gescrollt wird:
MonkeysViewModel viewModel = BindingContext as MonkeysViewModel;
Monkey monkey = viewModel.Monkeys.FirstOrDefault(m => m.Name == "Proboscis Monkey");
listView.ScrollTo(monkey, ScrollToPosition.MakeVisible, true);
Alternativ kann ein Element in gruppierten Daten durch Angabe des Elements und der Gruppe in die Ansicht verschoben werden. Das folgende Beispiel zeigt, wie Sie das Element "Proboscis Monkey" in der Gruppe "Monkeys" in der Ansicht scrollen:
GroupedAnimalsViewModel viewModel = BindingContext as GroupedAnimalsViewModel;
AnimalGroup group = viewModel.Animals.FirstOrDefault(a => a.Name == "Monkeys");
Animal monkey = group.FirstOrDefault(m => m.Name == "Proboscis Monkey");
listView.ScrollTo(monkey, group, ScrollToPosition.MakeVisible, true);
Hinweis
Das ScrollToRequested
Ereignis wird ausgelöst, wenn die ScrollTo
Methode aufgerufen wird.
Bildlaufanimation deaktivieren
Beim Scrollen eines Elements in die Ansicht wird eine Bildlaufanimation angezeigt. Diese Animation kann jedoch deaktiviert werden, indem sie das animated
Argument der ScrollTo
Methode auf false
:
listView.ScrollTo(monkey, position: ScrollToPosition.MakeVisible, animate: false);
Steuern der Bildlaufposition
Beim Scrollen eines Elements in die Ansicht kann die genaue Position des Elements nach Abschluss des Bildlaufs mit dem position
Argument der ScrollTo
Methoden angegeben werden. Dieses Argument akzeptiert ein Enumerationselement ScrollToPosition
.
MakeVisible
Das ScrollToPosition.MakeVisible
Element gibt an, dass das Element scrollen soll, bis es in der Ansicht sichtbar ist:
listView.ScrollTo(monkey, position: ScrollToPosition.MakeVisible, animate: true);
Start
Das ScrollToPosition.Start
Element gibt an, dass das Element zum Anfang der Ansicht scrollen soll:
listView.ScrollTo(monkey, position: ScrollToPosition.Start, animate: true);
Zentrieren
Das ScrollToPosition.Center
Element gibt an, dass das Element in der Mitte der Ansicht gescrollt werden soll:
listView.ScrollTo(monkey, position: ScrollToPosition.Center, animate: true);
ENDE
Das ScrollToPosition.End
Element gibt an, dass das Element bis zum Ende der Ansicht gescrollt werden soll:
listView.ScrollTo(monkey, position: ScrollToPosition.End, animate: true);
Sichtbarkeit der Bildlaufleiste
ListViewHorizontalScrollBarVisibility
definiert und VerticalScrollBarVisibility
Eigenschaften, die durch bindungsfähige Eigenschaften gesichert werden. Diese Eigenschaften rufen einen ScrollBarVisibility
Enumerationswert ab oder legen diesen fest, der angibt, wann die horizontale oder vertikale Bildlaufleiste sichtbar ist. Die ScrollBarVisibility
-Enumeration definiert die folgenden Member:
Default
gibt das Standardverhalten der Bildlaufleiste für die Plattform an und ist der Standardwert für die undVerticalScrollBarVisibility
dieHorizontalScrollBarVisibility
Eigenschaften.Always
gibt an, dass Bildlaufleisten sichtbar sind, auch wenn der Inhalt in die Ansicht passt.Never
gibt an, dass Bildlaufleisten nicht sichtbar sind, auch wenn der Inhalt nicht in die Ansicht passt.
Hinzufügen von Kontextmenüs
ListView unterstützt Kontextmenüelemente, die als MenuItem Objekte definiert sind, die der Auflistung in den ViewCell.ContextActions
DataTemplate einzelnen Elementen hinzugefügt werden:
<ListView x:Name="listView"
ItemsSource="{Binding Monkeys}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.ContextActions>
<MenuItem Text="Favorite"
Command="{Binding Source={x:Reference listView}, Path=BindingContext.FavoriteCommand}"
CommandParameter="{Binding}" />
<MenuItem Text="Delete"
Command="{Binding Source={x:Reference listView}, Path=BindingContext.DeleteCommand}"
CommandParameter="{Binding}" />
</ViewCell.ContextActions>
...
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Die MenuItem Objekte werden angezeigt, wenn mit der ListView rechten Maustaste auf ein Element geklickt wird:
Weitere Informationen zu Menüelementen finden Sie unter Anzeigen von Menüelementen.
Aktualisierung durch Ziehen
ListView unterstützt pull to refresh functionality, which enables the data being displayed to be refreshed by pulling down on the list of items.
Um die Aktualisierung durch Ziehen zu aktivieren, legen Sie die IsPullToRefreshEnabled
Eigenschaft auf true
. Wenn eine Aktualisierung ausgelöst wird, ListView löst das Refreshing
Ereignis aus, und die IsRefreshing
Eigenschaft wird auf true
. Der code, der zum Aktualisieren des Inhalts des ListView Ereignisses erforderlich ist, sollte dann vom Handler für das Refreshing
Ereignis oder von der ICommand Implementierung RefreshCommand
ausgeführt werden. Nachdem die ListView Aktualisierung aktualisiert wurde, sollte die IsRefreshing
Eigenschaft auf false
, oder die EndRefresh
Methode aufgerufen werden ListView, um anzugeben, dass die Aktualisierung abgeschlossen ist.
Das folgende Beispiel zeigt ein ListView Pull zum Aktualisieren:
<ListView ItemsSource="{Binding Animals}"
IsPullToRefreshEnabled="true"
RefreshCommand="{Binding RefreshCommand}"
IsRefreshing="{Binding IsRefreshing}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
...
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Wenn der Benutzer in diesem Beispiel eine Aktualisierung initiiert, wird die ICommand durch die RefreshCommand
Eigenschaft definierte Ausführung ausgeführt, wodurch die angezeigten Elemente aktualisiert werden sollen. Während der Aktualisierung wird eine Aktualisierungsvisualisierung angezeigt, die aus einem animierten Statuskreis besteht. Der Wert der IsRefreshing
Eigenschaft gibt den aktuellen Status des Aktualisierungsvorgangs an. Wenn eine Aktualisierung ausgelöst wird, wechselt diese Eigenschaft automatisch zu true
. Nach Abschluss der Aktualisierung sollten Sie die Eigenschaft auf false
.
Feedback
https://aka.ms/ContentUserFeedback.
Bald verfügbar: Im Laufe des Jahres 2024 werden wir GitHub-Issues stufenweise als Feedbackmechanismus für Inhalte abbauen und durch ein neues Feedbacksystem ersetzen. Weitere Informationen finden Sie unterFeedback senden und anzeigen für