Udostępnij za pośrednictwem

Używanie przykładowych danych w czasie projektowania z projektantem XAML w programie Visual Studio

Niektóre kontrolki oparte na danych, takie jak ListView, ListBoxi DataGrid, są trudne do wizualizacji bez danych. W tym artykule przyjrzymy się nowemu podejściu, które umożliwia deweloperom pracującym nad projektami Windows Presentation Foundation (WPF) opartymi na platformach .NET Core lub .NET Framework, korzystającymi z projektanta XAML w Visual Studio, na włączenie danych przykładowych w tych kontrolkach.

Wymagania

Funkcja Przykładowe dane wymaga programu Visual Studio 2019 w wersji 16.10 lub nowszej.

Funkcja obsługuje projekty na pulpicie Windows kierowane na WPF dla .NET Core lub .NET Framework podczas korzystania z nowego projektanta. Aby włączyć nowego projektanta dla programu .NET Framework:

  1. Przejdź do Narzędzia>Opcje>Środowisko>Funkcje Podglądu.
  2. Wybierz Nowy projektant XAML WPF dla programu .NET Framework, a następnie uruchom ponownie program Visual Studio.

Podstawy funkcji Przykładowe dane

Funkcja Przykładowe dane jest przeznaczona tylko do wizualizacji w czasie projektowania. Jest ona wyświetlana tylko w projektancie XAML, a nie w uruchomionej aplikacji. W związku z tym jest ona stosowana do wersji właściwości ItemsSourced:ItemsSourcew czasie projektowania. Przykładowe dane wymagają przestrzeni nazw w czasie projektowania.

Notatka

Aby dowiedzieć się więcej o właściwościach czasu projektowania w języku XAML, zobacz właściwości czasu projektowania XAML.

Aby rozpocząć, dodaj następujące wiersze kodu do nagłówka dokumentu XAML, jeśli nie są jeszcze obecne:

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

Po dodaniu przestrzeni nazw, możesz użyć d:ItemsSource="{d:SampleData}" do włączenia przykładowych danych w kontrolce ListView, Listboxlub DataGrid. Na przykład:

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

Zrzut ekranu przedstawiający przykładowe dane w siatce danych.

W tym przykładzie bez d:ItemsSource="{d:SampleData}"projektant XAML wyświetli pustą siatkę danych. Zamiast tego przy użyciu d:SampleDatateraz są wyświetlane wygenerowane domyślne przykładowe dane.

Domyślnie są wyświetlane pięć elementów. Można jednak użyć właściwości ItemCount, aby określić liczbę elementów do wyświetlenia. Na przykład: d:ItemsSource="{d:SampleData ItemCount=2}".

Przykładowe dane z szablonami danych

Funkcja Przykładowe dane działa w przypadku kontrolek ListBox, ListViewlub DataGrid podczas korzystania z szablonów danych. Funkcja przeanalizuje kontrolkę DataTemplate i spróbuje wygenerować odpowiednie dane.

Przykładowe dane będą generowane tylko dla elementów w szablonach danych, które używają powiązań. Przykładowe dane będą generowane nawet wtedy, gdy powiązania nie mają jeszcze źródła. Na przykład:

<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>

Zrzut ekranu przedstawiający przykładowe dane w widoku listy z szablonem danych.

Przykładowe dane z sugerowanymi akcjami

Aby łatwo włączyć lub wyłączyć przykładowe dane dla kontrolki z poziomu projektanta, możesz użyć funkcji Sugerowane akcje. Sugerowane akcje to żarówka w projektancie wyświetlana w prawym górnym rogu po wybraniu kontrolki. Możesz włączyć przykładowe dane, wybierając kontrolkę, wybierając żarówkę, a następnie wybierając Pokaż przykładowe dane. Na przykład:

Zrzut ekranu przedstawiający przykładowe dane z sugerowanymi akcjami.

Przykładowe dane z interfejsem IValueConverter

Funkcja Przykładowe dane nie obsługuje w pełni konwerterów ani interfejsu IValueConverter. Możesz jednak sprawić, aby to zadziałało, wykonując jedną lub obie z następujących czynności:

  • Upewnij się, że funkcja Convert może obsługiwać scenariusz, w którym wartość jest już typem docelowym.
  • Zaimplementuj funkcję ConvertBack, która przekonwertuje wartość z powrotem na oryginalny typ.

Rozwiązywanie problemów

Jeśli przykładowe dane nie są wyświetlane lub nie są wyświetlane w poprawnym formacie, możesz spróbować odświeżyć kreatora lub zamknąć i ponownie otworzyć stronę.

Jeśli wystąpi problem, którego nie ma na liście w tej sekcji lub którego nie można rozwiązać, odświeżając stronę, poinformuj nas, korzystając z narzędzia Zgłoś problem.

Powiązana zawartość