Delen via


Ontwerptijdvoorbeeldgegevens gebruiken met de XAML Designer in Visual Studio

Sommige besturingselementen die afhankelijk zijn van gegevens, zoals ListView, ListBoxen DataGrid, zijn moeilijk te visualiseren zonder gegevens. In dit artikel bekijken we een nieuwe benadering waarmee ontwikkelaars, die met WPF .NET Core-projecten of WPF .NET Framework-projecten werken in de XAML Designer van Visual Studio, voorbeeldgegevens in deze besturingselementen kunnen inschakelen.

Eisen

Voor de functie Voorbeeldgegevens is Visual Studio 2019 versie 16.10 of hoger vereist. De functie ondersteunt Windows-bureaubladprojecten die gericht zijn op WPF voor .NET Core of .NET Framework wanneer u de nieuwe ontwerpfunctie gebruikt.

Basisbeginselen van de functie Voorbeeldgegevens

De functie Voorbeeldgegevens is alleen bedoeld voor ontwerpvisualisatie. Deze wordt alleen weergegeven in de XAML-ontwerpfunctie, niet in de actieve app. Als zodanig wordt deze toegepast op de ontwerptijdversie van de eigenschap ItemsSourced:ItemsSource. Voor voorbeeldgegevens moet de ontwerp-tijdnaamruimte werken.

Notitie

Zie XAML-ontwerptijdeigenschappenvoor meer informatie over ontwerptijdeigenschappen in XAML.

Als u wilt beginnen, voegt u de volgende coderegels toe aan de koptekst van uw XAML-document als deze nog niet aanwezig zijn:

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

Nadat u de naamruimten hebt toegevoegd, kunt u d:ItemsSource="{d:SampleData}" gebruiken om voorbeeldgegevens in te schakelen in uw ListView, Listboxof DataGrid besturingselement. Bijvoorbeeld:

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

Schermopname van voorbeeldgegevens in een gegevensraster.

In dit voorbeeld, zonder d:ItemsSource="{d:SampleData}", zou de XAML Designer een leeg gegevensraster weergeven. In plaats daarvan worden met d:SampleDatanu gegenereerde standaardvoorbeeldgegevens weergegeven.

Standaard worden vijf items weergegeven. U kunt echter de eigenschap ItemCount gebruiken om op te geven hoeveel items u wilt weergeven. Bijvoorbeeld: d:ItemsSource="{d:SampleData ItemCount=2}".

Voorbeeldgegevens met gegevenssjablonen

De functie Voorbeeldgegevens werkt voor de controls ListBox, ListViewof DataGrid wanneer u gegevenssjablonen gebruikt. De functie analyseert het DataTemplate besturingselement en probeert de juiste gegevens ervoor te genereren.

Voorbeeldgegevens worden alleen gegenereerd voor elementen in gegevenssjablonen die bindingen gebruiken. Er worden voorbeeldgegevens gegenereerd, zelfs als de bindingen nog geen bron hebben. Bijvoorbeeld:

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

Schermopname van voorbeeldgegevens in een lijstweergave met een gegevenssjabloon.

Voorbeeldgegevens met voorgestelde acties

Als u voorbeeldgegevens voor een besturingselement vanuit de ontwerpfunctie eenvoudig wilt in- of uitschakelen, kunt u de functie Voorgestelde acties gebruiken. Voorgestelde acties is een suggestie-indicator in de ontwerpomgeving die rechtsboven verschijnt wanneer u een controle-element selecteert. U kunt voorbeeldgegevens inschakelen door uw besturingsoptie te selecteren, de gloeilamp te selecteren en vervolgens Voorbeeldgegevens weergeven te selecteren. Bijvoorbeeld:

Schermopname van voorbeeldgegevens met Voorgestelde acties.

Voorbeeldgegevens met de IValueConverter-interface

De functie Voorbeeldgegevens biedt geen volledige ondersteuning voor conversieprogramma's of de IValueConverter-interface. U kunt het echter wel laten werken door een of beide van de volgende handelingen uit te voeren:

  • Zorg ervoor dat uw Convert-functie een scenario kan verwerken waarbij de waarde al uw doeltype is.
  • Implementeer de ConvertBack-functie waarmee de waarde wordt geconverteerd naar het oorspronkelijke type.

Probleemoplossing

Als uw voorbeeldgegevens niets weergeven of het juiste type niet weergeven, kunt u proberen de ontwerpfunctie te vernieuwen of de pagina te sluiten en opnieuw te openen.

Als u een probleem ondervindt dat niet wordt vermeld in deze sectie of die niet kan worden opgelost door de pagina te vernieuwen, laat het ons dan weten met behulp van het hulpprogramma Een probleem melden.