Freigeben über

Verwenden von Beispieldaten zur Entwurfszeit mit dem XAML-Designer in Visual Studio

  • Artikel

Einige datenbasierte Steuerelemente wie ListView, ListBox und DataGrid sind ohne Daten nur schwierig zu visualisieren. In diesem Artikel wird ein neuer Ansatz erläutert, mit dem Entwickler*innen, die an WPF-.NET Core-Projekten (Windows Presentation Foundation) oder WPF-.NET Framework-Projekten mit dem XAML-Designer in Visual Studio arbeiten, Beispieldaten in diesen Steuerelementen aktivieren können.

Requirements (Anforderungen)

Das Feature für Beispieldaten erfordert Visual Studio 2019 Version 16.10 oder höher.

Das Feature unterstützt Windows-Desktopprojekte, die WPF für .NET Core oder .NET Framework verwenden, wenn Sie den neuen Designer verwenden. So aktivieren Sie den neuen Designer für .NET Framework

  1. Wechseln Sie zu Extras>Optionen>Umgebung>Previewfunktionen.
  2. Wählen Sie Neuen WPF-XAML-Designer für .NET Framework aktivieren aus, und starten Sie Visual Studio dann neu.

Grundlagen des Features für Beispieldaten

Das Feature für Beispieldaten dient nur zur Entwurfszeitvisualisierung. Es wird nur im XAML-Designer und nicht in der ausgeführten App angezeigt. Daher wird es auch nur auf die Entwurfszeitversion der ItemsSource-Eigenschaft d:ItemsSource angewandt. Damit Beispieldaten funktionieren, ist der Entwurfszeitnamespace erforderlich.

Hinweis

Weitere Informationen zu Entwurfszeiteigenschaften in XAML finden Sie unter XAML-Entwurfszeiteigenschaften.

Fügen Sie zunächst dem Header Ihres XAML-Dokuments die folgenden Codezeilen hinzu, wenn sie nicht bereits vorhanden sind:

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"

Nachdem Sie die Namespaces hinzugefügt haben, können Sie d:ItemsSource="{d:SampleData}" verwenden, um Beispieldaten in Ihrem ListView-, Listbox- oder DataGrid-Steuerelement zu aktivieren. Beispiel:

<DataGrid d:ItemsSource="{d:SampleData}"/>

Screenshot that shows sample data on a data grid.

In diesem Beispiel würde der XAML-Designer ohne d:ItemsSource="{d:SampleData}" ein leeres Datenraster anzeigen. Mit d:SampleData werden stattdessen generierte Standardbeispieldaten angezeigt.

Standardmäßig werden fünf Elemente angezeigt. Sie können jedoch die ItemCount-Eigenschaft verwenden, um anzugeben, wie viele Elemente angezeigt werden sollen. Beispiel: d:ItemsSource="{d:SampleData ItemCount=2}".

Beispieldaten mit Datenvorlagen

Das Feature für Beispieldaten funktioniert für ListBox-, ListView- oder DataGrid-Steuerelemente, wenn Sie Datenvorlagen verwenden. Das Feature analysiert das DataTemplate-Steuerelement und versucht, geeignete Daten dafür zu generieren.

Beispieldaten werden nur für Elemente in Datenvorlagen generiert, die Bindungen verwenden. Beispieldaten werden auch dann generiert, wenn die Bindungen noch keine Quelle haben. Beispiel:

<ListView d:ItemsSource="{d:SampleData ItemCount=3}">
     <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Image Width="50" Source="{Binding ProfilePicture}"/>
                <StackPanel Orientation="Vertical">
                    <TextBlock Text="{Binding FirstName}" Margin="5"/>
                    <Label Content="{Binding LastName}"/>
                </StackPanel>
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Screenshot that shows sample data in a list view with a data template.

Beispieldaten mit vorgeschlagenen Aktionen

Zum einfachen Aktivieren oder Deaktivieren von Beispieldaten für ein Steuerelement im Designer können Sie das Feature für vorgeschlagene Aktionen verwenden. Sie erreichen die vorgeschlagenen Aktionen über eine Glühlampe im Designer, die rechts oben angezeigt wird, wenn Sie ein Steuerelement auswählen. Sie können Beispieldaten aktivieren, indem Sie Ihr Steuerelement, anschließend die Glühlampe und dann Beispieldaten anzeigen auswählen. Beispiel:

Screenshot that shows sample data with Suggested Actions.

Beispieldaten mit der IValueConverter-Schnittstelle

Das Feature für Beispieldaten unterstützt Konverter oder die IValueConverter-Schnittstelle nicht vollständig. Sie können dies jedoch durch einen oder beide der folgenden Schritte erreichen:

  • Stellen Sie sicher, dass Ihre Convert-Funktion ein Szenario verarbeiten kann, in dem der Wert bereits Ihr Zieltyp ist.
  • Implementieren Sie die ConvertBack-Funktion, die Ihren Wert zurück in den ursprünglichen Typ konvertiert.

Problembehandlung

Wenn Ihre Beispieldaten nichts oder nicht den richtigen Typ anzeigen, können Sie versuchen, den Designer zu aktualisieren oder die Seite zu schließen und erneut zu öffnen.

Wenn ein Problem auftritt, das in diesem Abschnitt nicht aufgeführt ist oder nicht durch Aktualisieren der Seite behoben werden kann, informieren Sie uns über das Tool Problem melden.

Zugehöriger Inhalt