Udostępnij za pośrednictwem

Używanie przykładowych danych czasu projektowania z Projektant XAML w programie Visual Studio

  • Artykuł

Niektóre kontrolki oparte na danych, takie jak ListView, ListBoxi DataGrid, są trudne do wizualizacji bez danych. W tym artykule zapoznamy się z nowym podejściem, które umożliwia deweloperom pracującym nad projektami platformy .NET Core (WPF) systemu Windows Presentation Foundation (WPF) lub projektami WPF .NET Framework za pomocą Projektant XAML w programie Visual Studio, aby umożliwić przykładowe dane w tych kontrolkach.

Wymagania

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

Funkcja obsługuje projekty klasyczne systemu Windows przeznaczone dla platformy WPF dla platformy .NET Core lub .NET Framework podczas korzystania z nowego projektanta. Aby włączyć nowego projektanta dla programu .NET Framework:

  1. Przejdź do pozycji Narzędzia>Opcje>środowiska>w wersji zapoznawczej funkcje.
  2. Wybierz pozycję 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 ItemsSource d:ItemsSourcewłaściwości w czasie projektowania . Przykładowe dane wymagają przestrzeni nazw w czasie projektowania.

Uwaga

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}" polecenia , aby włączyć przykładowe dane w kontrolce ListView, Listboxlub DataGrid . Na przykład:

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

Screenshot that shows sample data on a data grid.

W tym przykładzie bez d:ItemsSource="{d:SampleData}"biblioteki Projektant XAML będą pokazywać pustą siatkę danych. Zamiast tego za pomocą d:SampleDatapolecenia jest teraz wyświetlane wygenerowane domyślne przykładowe dane.

Domyślnie są wyświetlane pięć elementów. Można jednak użyć ItemCount właściwości , 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 ListBoxkontrolek , 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>

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

Przykładowe dane z sugerowanymi akcjami

Aby łatwo włączyć lub wyłączyć przykładowe dane dla kontrolki od 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. Przykładowe dane można włączyć, wybierając kontrolkę, wybierając żarówkę, a następnie wybierając pozycję Pokaż przykładowe dane. Na przykład:

Screenshot that shows sample data with Suggested Actions.

Przykładowe dane z interfejsem IValueConverter

Funkcja Przykładowe dane nie obsługuje w pełni konwerterów ani interfejsu IValueConverter . Możesz jednak wykonać jedną lub obie z następujących czynności:

  • Upewnij się, że Convert funkcja może obsługiwać scenariusz, w którym wartość jest już typem docelowym.
  • Zaimplementuj ConvertBack funkcję, 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 poprawnego typu, możesz spróbować odświeżyć projektanta 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ść