Freigeben über

Einführung in Xamarin.Forms-Datenvorlagen

  • Artikel

Xamarin.Forms-Datenvorlagen bieten die Möglichkeit, die Darstellung von Daten für unterstützte Steuerelemente zu definieren. In diesem Artikel werden Datenvorlagen grundlegend vorgestellt, und es wird erläutert, warum sie nötig sind.

Nehmen wir an, Sie haben eine ListView-Klasse, die eine Sammlung von Person-Objekten anzeigt. Das folgende Codebeispiel veranschaulicht die Definition der Person-Klasse:

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
    public string Location { get; set; }
}

Die Person-Klasse definiert die Eigenschaften Name, Age und Location, die Sie beim Erstellen eines Person-Objekts festlegen können. Die ListView-Klasse zeigt die Sammlung der Person-Objekte wie in diesem XAML-Codebeispiel veranschaulicht:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DataTemplates"
             ...>
    <StackLayout Margin="20">
        ...
        <ListView Margin="0,20,0,0">
            <ListView.ItemsSource>
                <x:Array Type="{x:Type local:Person}">
                    <local:Person Name="Steve" Age="21" Location="USA" />
                    <local:Person Name="John" Age="37" Location="USA" />
                    <local:Person Name="Tom" Age="42" Location="UK" />
                    <local:Person Name="Lucas" Age="29" Location="Germany" />
                    <local:Person Name="Tariq" Age="39" Location="UK" />
                    <local:Person Name="Jane" Age="30" Location="USA" />
                </x:Array>
            </ListView.ItemsSource>
        </ListView>
    </StackLayout>
</ContentPage>

Sie können der ListView-Klasse in XAML Elemente hinzufügen, indem Sie die Eigenschaft ItemsSource aus einem Array von Person-Instanzen heraus initialisieren.

Hinweis

Bedenken Sie, dass Sie für das Element x:Array ein Type-Attribute benötigen, das die Elementtypen im Array angibt.

Die entsprechende C#-Seite ist im folgenden Codebeispiel enthalten, das die Eigenschaft ItemsSource für eine Liste (List) vonPerson-Instanzen initialisiert:

public WithoutDataTemplatePageCS()
{
    ...
    var people = new List<Person>
    {
        new Person { Name = "Steve", Age = 21, Location = "USA" },
        new Person { Name = "John", Age = 37, Location = "USA" },
        new Person { Name = "Tom", Age = 42, Location = "UK" },
        new Person { Name = "Lucas", Age = 29, Location = "Germany" },
        new Person { Name = "Tariq", Age = 39, Location = "UK" },
        new Person { Name = "Jane", Age = 30, Location = "USA" }
    };

    Content = new StackLayout
    {
        Margin = new Thickness(20),
        Children = {
            ...
            new ListView { ItemsSource = people, Margin = new Thickness(0, 20, 0, 0) }
        }
    };
}

Die ListView-Klasse ruft beim Anzeigen der Sammlungsobjekte ToString auf. Da Person.ToString nicht außer Kraft gesetzt wird, wird für ToString der Typname jedes einzelnen Objekts zurückgegeben, wie in den folgenden Screenshots gezeigt:

ListView ohne Datenvorlage

Wie im folgenden Codebeispiel gezeigt, kann das Objekt Person die ToString-Methode überschreiben, damit aussagekräftige Daten angezeigt werden:

public class Person
{
  ...
  public override string ToString ()
  {
    return Name;
  }
}

Wie im nachfolgenden Screenshot zu sehen, zeigt dadurch das Element ListView für jedes Objekt in der Sammlung den Wert der Eigenschaft Person.Name an:

ListView mit einer Datenvorlage

Durch die Außerkraftsetzung von Person.ToString kann eine formatierte Zeichenfolge zurückgegeben werden, die aus den Eigenschaften Name, Age und Location besteht. So haben Sie jedoch nur wenig Kontrolle über die Darstellung der einzelnen Daten. Für mehr Flexibilität können Sie eine DataTemplate-Klasse erstellen, die die Darstellung der Daten definiert.

Erstellen eines -DataTemplate-Objekts

Mit einer DataTemplate-Klasse legen Sie die Darstellung der Daten fest. Zum Anzeigen der Daten wird für gewöhnlich eine Datenbindung verwendet. Diese Klasse findet häufig Anwendung, wenn Daten aus einer Objektsammlung einer ListView-Klasse angezeigt werden sollen. Ein mögliches Szenario wäre eine ListView-Klasse, die an eine Sammlung von Person-Objekten gebunden ist. Die ListView.ItemTemplate-Eigenschaft wird auf eine DataTemplate-Klasse festgelegt, die die Darstellung der einzelnen Person-Objekte in der ListView-Klasse definiert. Die DataTemplate-Klasse enthält Elemente, die an die Eigenschaftswerte der einzelnen Person Objekte gebunden sind. Weitere Informationen zur Datenbindung finden Sie unter Data Binding Basics (Datenbindungsgrundlagen).

Eine DataTemplate-Klasse, die den oben aufgelisteten Eigenschaften direkt untergeordnet ist, wird als Inlinevorlage bezeichnet. Sie können eine DataTemplate-Klasse aber auch als Ressource auf Steuerelement-, Seiten- oder Anwendungsebene definieren. Die Entscheidung, wo Sie eine DataTemplate-Klasse definieren, hat Einfluss darauf, wo Sie sie verwenden können:

  • Eine auf Steuerelementebene definierte DataTemplate-Klasse kann nur auf ein bestimmtes Steuerelement angewendet werden.
  • Eine auf Seitenebene definierte DataTemplate-Klasse kann auf mehrere gültige Steuerelemente auf einer Seite angewendet werden.
  • Eine auf Anwendungsebene definierte DataTemplate-Klasse können Sie für alle gültigen Steuerelemente einer Anwendung nutzen.

Datenvorlagen, die weiter unten in der Hierarchie der Ansichten angeordnet sind, haben Vorrang vor denjenigen, die sich weiter oben befinden. Voraussetzung ist, dass gemeinsame x:Key-Attribute vorliegen. So gilt z. B. Folgendes: Eine Datenvorlage auf Anwendungsebene wird von einer Datenvorlage auf Seitenebene außer Kraft gesetzt. Die Datenvorlage auf Seitenebene wiederum kann durch eine Datenvorlage auf Steuerelementebene oder eine Inlinedatenvorlage außer Kraft gesetzt werden.