ListView

Durchsuchen des Beispiels

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 Typ IEnumerable, gibt die Auflistung der anzuzeigenden Elemente an und hat einen Standardwert von null.
• 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 Typ object, gibt die Zeichenfolge oder Ansicht an, die am Ende der Liste angezeigt wird.
• FooterTemplate, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren der Footer.
• GroupHeaderTemplate, vom Typ DataTemplate, definiert die DataTemplate zum Definieren der Darstellung der Kopfzeile jeder Gruppe verwendet. Diese Eigenschaft schließt sich gegenseitig mit der GroupDisplayBinding Eigenschaft aus. Daher wird GroupDisplayBinding die Einstellung dieser Eigenschaft auf null.
• HasUnevenRows, vom Typ bool, gibt an, ob Elemente in der Liste Zeilen mit unterschiedlichen Höhen enthalten können. Der Standardwert dieser Eigenschaft ist false.
• Header, vom Typ object, gibt die Zeichenfolge oder Ansicht an, die am Anfang der Liste angezeigt wird.
• HeaderTemplate, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren der Header.
• HorizontalScrollBarVisibility, vom Typ ScrollBarVisibility, gibt an, wann die horizontale Bildlaufleiste sichtbar ist.
• IsGroupedEnabled, vom Typ bool, gibt an, ob die zugrunde liegenden Daten in Gruppen angezeigt werden sollen. Der Standardwert dieser Eigenschaft ist false.
• IsPullToRefreshEnabled, vom Typ bool, gibt an, ob der Benutzer nach unten wischen kann, um die ListView Daten zu aktualisieren. Der Standardwert dieser Eigenschaft ist false.
• IsRefreshing, vom Typ bool, gibt an, ob die ListView aktuelle Aktualisierung erfolgt. Der Standardwert dieser Eigenschaft ist false.
• 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 Typ int, bestimmt die Höhe jeder Zeile, wenn HasUnevenRows dies ist false.
• SelectedItem, vom Typ object, stellt das aktuell ausgewählte Element in der ListView.
• SelectionMode, vom Typ ListViewSelectionMode, gibt an, ob Elemente in der ListView oder nicht ausgewählt werden können. Der Standardwert dieser Eigenschaft ist Single.
• SeparatorColor, vom Typ Color, definiert die Farbe der Leiste, die Elemente in der Liste trennt.
• SeparatorVisibility, vom Typ SeparatorVisibility, definiert, ob Trennzeichen zwischen Elementen sichtbar sind.
• VerticalScrollBarVisibility, vom Typ ScrollBarVisibility, 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 Typ BindingBase, die Bindung, die für die Anzeige der Gruppenkopf verwendet werden soll. Diese Eigenschaft schließt sich gegenseitig mit der GroupHeaderTemplate Eigenschaft aus. Daher wird GroupHeaderTemplate die Einstellung dieser Eigenschaft auf null.
• GroupShortNameBinding, vom Typ BindingBase, die Bindung für den Namen, der in gruppierten Sprunglisten angezeigt werden soll.
• CachingStrategy, vom Typ ListViewCachingStrategy, definiert die Wiederverwendungsstrategie der Zelle .ListView Dies ist eine schreibgeschützte Eigenschaft.

ListView definiert die folgenden Ereignisse:

• ItemAppearingwird ausgelöst, wenn die visuelle Darstellung eines Elements dem visuellen Layout des Elements ListViewhinzugefügt wird. Das ItemVisibilityEventArgs Objekt, das dieses Ereignis begleitet, definiert Item und Index eigenschaften.
• ItemDisappearingwird ausgelöst, wenn die visuelle Darstellung eines Elements aus dem visuellen Layout des Elements ListViewentfernt wird. Das ItemVisibilityEventArgs Objekt, das dieses Ereignis begleitet, definiert Item und Index eigenschaften.
• ItemSelectedwird ausgelöst, wenn ein neues Element in der Liste ausgewählt wird. Das SelectedItemChangedEventArgs Objekt, das dieses Ereignis begleitet, definiert SelectedItem und SelectedItemIndex eigenschaften.
• ItemTapped, der ausgelöst wird, wenn ein Element in der ListView Koppelung angetippt wird. Das ItemTappedEventArgs Objekt, das dieses Ereignis begleitet, definiert Group, Itemund ItemIndex Eigenschaften.
• Refreshingwird ausgelöst, wenn ein Aktualisierungsvorgang durch Ziehen ausgelöst ListViewwird.
• Scrolled, . Das ScrolledEventArgs Objekt, das dieses Ereignis begleitet, definiert ScrollX und ScrollY eigenschaften.
• ScrollToRequested . Das ScrollToRequestedEventArgs Objekt, das dieses Ereignis begleitet, definiert Element, , Mode, Position, , ScrollXund ShouldAnimateScrollYEigenschaften.

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 Typ string, definiert den primären Text, der angezeigt werden soll.
• TextColor, vom Typ Color, stellt die Farbe des primären Texts dar.
• Detail, vom Typ string, 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 Typ object, 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 OtherMonkeyDataTemplate 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 <a0/> festgelegt ist, kann ein einzelnes Element ausgewählt ListView werden. Wenn ein Element ausgewählt ist, wird die 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 <a0/> festgelegt ist, können elemente nicht ListView ausgewählt werden, wird die SelectedItem Eigenschaft erneut Standard nullund 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:

• RetainElementgibt 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ährend RecycleElement 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 MyViewCellAzurückgegeben wird) oder MyDataTemplateB (wobei MyDataTemplateB ein ViewCell Typ MyViewCellBzurü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 ListViewCachingStrategyx: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 Typ object, gibt die Zeichenfolge, Bindung oder Ansicht an, die am Anfang der Liste angezeigt wird.
• HeaderTemplate, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren der Header.
• Footer, vom Typ object, gibt die Zeichenfolge, Bindung oder Ansicht an, die am Ende der Liste angezeigt wird.
• FooterTemplate, vom Typ DataTemplate, gibt die DataTemplate zum Formatieren der Footer.

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 SeparatorVisibilityauf :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 falsedie 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 <a0/> festgelegt ist, kann jedes Element in der ListView Datei eine andere Höhe aufweisen. Die Höhe der einzelnen Elemente wird vom Inhalt des Elements DataTemplateabgeleitet, sodass jedes Element an seinen Inhalt angepasst wird.

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 " RightToLeftfestgelegt 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, wobei T 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 Bearsund enthält eine List<Animal> Sammlung von Bärendetails. Die zweite AnimalGroup ist benannt Monkeysund 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, , Modeund 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 Typ double, stellt die X-Position des Bildlaufs dar.
• ScrollY, vom Typ double, 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 listViewzeigt 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:

• Defaultgibt das Standardverhalten der Bildlaufleiste für die Plattform an und ist der Standardwert für die und VerticalScrollBarVisibility die HorizontalScrollBarVisibility 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.ContextActionsDataTemplate 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.