Używanie danych czasu projektowania z Projektant XAML w programie Visual Studio
Niektóre układy są trudne do wizualizacji bez danych. W tym dokumencie zapoznamy się z jednym z podejść, które deweloperzy pracujący nad projektami komputerowymi mogą używać do pozorowania danych w projektancie XAML. Ta metoda jest wykonywana przy użyciu istniejącej przestrzeni nazw "d:" z możliwością ignorowania. Dzięki temu podejściu można szybko dodawać dane czasu projektowania do stron lub kontrolek bez konieczności tworzenia pełnej makiety Modelu ViewModel lub po prostu przetestować, jak zmiana właściwości może mieć wpływ na aplikację, nie martwiąc się, że te zmiany wpłyną na kompilacje wydania. Wszystkie d: dane są używane tylko przez Projektant XAML i nie są kompilowane żadne ignorowane wartości przestrzeni nazw w aplikacji.
Uwaga
Jeśli używasz zestawu narzędzi Xamarin.Forms, zobacz Dane dotyczące czasu projektowania zestawu narzędzi Xamarin.Forms
Podstawy danych czasu projektowania
Dane czasu projektowania to dane pozorne ustawione w celu ułatwienia wizualizacji kontrolek w Projektant 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żna umieścić d: przed dowolnym atrybutem lub kontrolką, aby pokazać ją tylko w Projektant XAML, ale nie w czasie wykonywania.
Możesz na przykład dodać tekst do bloku TextBlock, który zwykle ma powiązane dane.
<TextBlock Text="{Binding Name}" d:Text="Name!" />
W tym przykładzie bez d:Textbiblioteki Projektant XAML nie będą wyświetlane żadne elementy dla funkcji TextBlock. Zamiast tego zostanie wyświetlony komunikat "Name!", w którym element TextBlock będzie miał rzeczywiste dane w czasie wykonywania.
Można używać d: z atrybutami dla dowolnej kontrolki platformy UWP lub WPF .NET Core, takich jak kolory, rozmiary czcionek i odstępy. Możesz nawet dodać ją do samej kontrolki.
<d:Button Content="Design Time Button" />
W tym przykładzie przycisk jest wyświetlany tylko w czasie projektowania. Użyj tej metody, aby umieścić symbol zastępczy dla kontrolki niestandardowej lub wypróbować różne kontrolki. Wszystkie d: atrybuty i kontrolki będą ignorowane podczas wykonywania.
Podgląd obrazów w czasie projektowania
Źródło czasu projektowania można ustawić dla obrazów, które są powiązane ze stroną lub ładowane dynamicznie. Dodaj obraz, który chcesz wyświetlić w Projektant XAML do projektu. Następnie można wyświetlić ten obraz w Projektant XAML w czasie projektowania:
<Image Source={Binding ProfilePicture} d:Source="DesignTimePicture.jpg" />
Uwaga
Obraz w tym przykładzie musi istnieć w rozwiązaniu.
Dane dotyczące czasu projektowania elementów ListView
ListViews to popularny sposób wyświetlania danych w aplikacji klasycznej. Trudno je jednak wizualizować bez żadnych danych. Tej funkcji można użyć do utworzenia wbudowanego elementu itemsource lub items w czasie projektowania. Projektant XAML wyświetla zawartość tej tablicy w kodzie ListView w czasie projektowania.
Przykład platformy .NET Core WPF
Aby użyć typu system:String, upewnij się, że znajdujesz xmlns:system="clr-namespace:System;assembly=mscorlib się w nagłówku XAML.
<StackPanel>
<ListView ItemsSource="{Binding Items}">
<d:ListView.ItemsSource>
<x:Array Type="{x:Type system:String}">
<system:String>Item One</system:String>
<system:String>Item Two</system:String>
<system:String>Item Three</system:String>
</x:Array>
</d:ListView.ItemsSource>
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding ItemName}" d:Text="{Binding .}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
W tym poprzednim przykładzie pokazano element ListView z trzema blokami TextBlocks w Projektant XAML.
Można również utworzyć tablicę obiektów danych. Na przykład publiczne właściwości City obiektu danych mogą być konstruowane jako dane czasu projektowania.
namespace Cities.Models
{
public class City
{
public string Name { get; set; }
public string Country { get; set; }
}
}
Aby użyć klasy w języku XAML, należy zaimportować przestrzeń nazw w węźle głównym.
xmlns:models="clr-namespace:Cities.Models"
<StackPanel>
<ListView ItemsSource="{Binding Items}">
<d:ListView.ItemsSource>
<x:Array Type="{x:Type models:City}">
<models:City Name="Seattle" Country="United States"/>
<models:City Name="London" Country="United Kingdom"/>
<models:City Name="Panama City" Country="Panama"/>
</x:Array>
</d:ListView.ItemsSource>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding Name}" Margin="0,0,5,0" />
<TextBlock Text="{Binding Country}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
Zaletą jest możliwość powiązania kontrolek z statyczną wersją modelu w czasie projektowania.
Przykład platformy UWP
Funkcja x:Array nie jest obsługiwana w systemie UWP. W związku z tym możemy zamiast tego użyć <d:ListView.Items> . Aby użyć typu system:String, upewnij się, że znajdujesz http://schemas.microsoft.com/winfx/2009/xaml się w nagłówku XAML.
<StackPanel>
<ListView>
<d:ListView.Items>
<system:String>Item One</system:String>
<system:String>Item Two</system:String>
<system:String>Item Three</system:String>
</d:ListView.Items>
</ListView>
</StackPanel>
Używanie danych w czasie projektowania z typami niestandardowymi i właściwościami
Ta funkcja domyślnie działa tylko z kontrolkami i właściwościami platformy. W tej sekcji omówimy kroki niezbędne do umożliwienia używania własnych kontrolek niestandardowych jako kontrolek czasu projektowania, nowej funkcji dostępnej dla klientów przy użyciu programu Visual Studio 2019 w wersji 16.8 lub nowszej. Istnieją trzy wymagania, które należy włączyć:
Niestandardowa przestrzeń nazw xmlns
xmlns:myControls="http://MyCustomControls"Wersja czasu projektowania przestrzeni nazw. Można to osiągnąć, dołączając /design na końcu.
xmlns:myDesignTimeControls="http://MyCustomControls/design"Dodawanie prefiksu czasu projektowania do elementu mc:Ignorable
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d myDesignTimeControls"
Po wykonaniu wszystkich tych kroków możesz użyć myDesignTimeControls prefiksu, aby utworzyć kontrolki czasu projektowania.
<myDesignTimeControls:MyButton>I am a design time Button</myDesignTimeControls:MyButton>
Tworzenie niestandardowej przestrzeni nazw xmlns
Aby utworzyć niestandardową przestrzeń nazw xmlns na platformie .NET Core WPF, musisz zamapować niestandardową przestrzeń nazw XML na przestrzeń nazw CLR, w której znajdują się kontrolki. Można to zrobić, dodając XmlnsDefinition atrybut poziomu zestawu w AssemblyInfo.cs pliku. Plik znajduje się w hierarchii głównej projektu.
[assembly: XmlnsDefinition("http://MyCustomControls", "MyViews.MyButtons")]
Rozwiązywanie problemów
Jeśli wystąpi problem, który nie znajduje się na liście w tej sekcji, poinformuj nas, korzystając z narzędzia Zgłoś problem .
Wymagania
Dane czasu projektowania wymagają programu Visual Studio 2019 w wersji 16.7 lub nowszej.
Obsługuje projekty klasyczne systemu Windows przeznaczone dla programu Windows Presentation Foundation (WPF) dla platformy .NET Core i platformy UWP. Ta funkcja jest również dostępna dla programu .NET Framework w kanale w wersji zapoznawczej. Aby ją włączyć, przejdź do pozycji Narzędzia>Opcje>Funkcje środowiska>w wersji zapoznawczej, wybierz pozycję Nowy Projektant XAML WPF dla programu .NET Framework, a następnie uruchom ponownie program Visual Studio.
Począwszy od programu Visual Studio 2019 w wersji 16.7, ta funkcja działa z wszystkimi wbudowanymi kontrolkami platform WPF i UWP. Obsługa kontrolek innych firm jest teraz dostępna w wersji 16.8.
Projektant XAML przestał działać
Spróbuj zamknąć i ponownie otworzyć plik XAML oraz wyczyścić i ponownie skompilować projekt.