Condividi tramite


Usare i dati di esempio in fase di progettazione con la finestra di progettazione XAML in Visual Studio

Alcuni controlli conformi ai dati, ad esempio ListView, ListBoxe DataGrid, sono difficili da visualizzare senza dati. In questo articolo verrà esaminato un nuovo approccio che consente agli sviluppatori che lavorano su progetti .NET Core di Windows Presentation Foundation (WPF) o progetti WPF .NET Framework con la finestra di progettazione XAML in Visual Studio di abilitare i dati di esempio in questi controlli.

Requisiti

La funzionalità Dati di esempio richiede Visual Studio 2019 versione 16.10 o successiva.

La funzionalità supporta progetti desktop windows destinati a WPF per .NET Core o .NET Framework quando si usa la nuova finestra di progettazione. Per abilitare la nuova finestra di progettazione per .NET Framework:

  1. Passare a Strumenti>Opzioni>ambiente>- Funzionalità di anteprima.
  2. Selezionare Nuova finestra di progettazione XAML WPF per .NET Framework e quindi riavviare Visual Studio.

Nozioni di base sulla funzionalità Dati di esempio

La funzionalità Dati di esempio è solo per la visualizzazione in fase di progettazione. Viene visualizzato solo nella finestra di progettazione XAML, non nell'app in esecuzione. Di conseguenza, viene applicato alla versione in fase di progettazione della ItemsSource proprietà d:ItemsSource. Per il funzionamento dei dati di esempio è necessario lo spazio dei nomi della fase di progettazione.

Nota

Per altre informazioni sulle proprietà della fase di progettazione in XAML, vedi Proprietà della fase di progettazione XAML.

Per iniziare, aggiungere le righe di codice seguenti all'intestazione del documento XAML, se non sono già presenti:

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

Dopo aver aggiunto gli spazi dei nomi, è possibile usare d:ItemsSource="{d:SampleData}" per abilitare i dati di esempio nel ListViewcontrollo , Listboxo DataGrid . Ad esempio:

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

Screenshot that shows sample data on a data grid.

In questo esempio, senza d:ItemsSource="{d:SampleData}", la finestra di progettazione XAML visualizzerebbe una griglia di dati vuota. Al contrario, con d:SampleData, vengono ora visualizzati i dati di esempio predefiniti generati.

Per impostazione predefinita, vengono visualizzati cinque elementi. Tuttavia, è possibile utilizzare la ItemCount proprietà per specificare il numero di elementi da visualizzare. Ad esempio: d:ItemsSource="{d:SampleData ItemCount=2}".

Dati di esempio con modelli di dati

La funzionalità Dati di esempio funziona per ListBoxi controlli , ListViewo DataGrid quando si usano modelli di dati. La funzionalità analizzerà il DataTemplate controllo e tenterà di generare i dati appropriati.

I dati di esempio verranno generati solo per gli elementi nei modelli di dati che usano associazioni. I dati di esempio verranno generati anche se le associazioni non hanno ancora un'origine. Ad esempio:

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

Dati di esempio con azioni suggerite

Per abilitare o disabilitare facilmente i dati di esempio per un controllo dalla finestra di progettazione, è possibile usare la funzionalità Azioni suggerite. Azioni suggerite è una lampadina nella finestra di progettazione visualizzata in alto a destra quando si seleziona un controllo. È possibile abilitare i dati di esempio selezionando il controllo, selezionando la lampadina e quindi selezionando Mostra dati di esempio. Ad esempio:

Screenshot that shows sample data with Suggested Actions.

Dati di esempio con l'interfaccia IValueConverter

La funzionalità Dati di esempio non supporta completamente i convertitori o l'interfaccia IValueConverter . Tuttavia, è possibile ottenerlo per funzionare eseguendo una o entrambe le operazioni seguenti:

  • Assicurarsi che la Convert funzione possa gestire uno scenario in cui il valore è già il tipo di destinazione.
  • Implementare la ConvertBack funzione che convertirà nuovamente il valore nel tipo originale.

Risoluzione dei problemi

Se i dati di esempio non visualizzano alcun elemento o non visualizzano il tipo corretto, è possibile provare ad aggiornare la finestra di progettazione o chiudere e riaprire la pagina.

Se si verifica un problema non elencato in questa sezione o che non può essere risolto aggiornando la pagina, segnalarlo usando lo strumento Segnala un problema .