Sergey Lutay's Blog

Read this article in your language IT | EN | DE | ES

Одна из новых возможностей Silverlight 5 - это использование неявных шаблонов данных. Уверен – вы уже работали с шаблонами данных при использовании элементов управления ListBox, DataGrid, ComboBox и другими. Шаблоны данных позволяют указать формат/разметку отображения не интерфейсных данных и использовать эту разметку в различных местах нашего приложения.

Неявные шаблоны позволяют формировать разметку, базируясь на типе данных. В более ранних версиях технологии необходимо было указывать ключ шаблона, что бы его использовать в нескольких местах приложения. Используя неявные шаблоны, нам необходимо лишь указать, для какого типа данных необходимо использовать шаблон. И так приступаем от слов к делу.

Создаем новый Silverlight 5 проект.

И добавляем несколько типов данных

public class Customer
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string Title { get; set; }
    public string Company { get; set; }
}

public class Employee
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public int Room { get; set; }
}

Следующий шаг, добавим несколько шаблонов данных в ресурсы приложения(файл App.xaml)

<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
             x:Class="ImplicitDataTemplate.App"
             xmlns:data="clr-namespace:ImplicitDataTemplate">
    <Application.Resources>
        <DataTemplate DataType="data:Customer">
            <Grid Background="LightSkyBlue">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding FirstName, StringFormat='\{0\} '}"/>
                    <TextBlock Text="{Binding LastName}"/>
                </StackPanel>
                <StackPanel Grid.Row="1">
                    <TextBlock Text="{Binding Title}" FontStyle="Italic"/>
                    <TextBlock Text="{Binding Company, StringFormat='Компания: \{0\}'}" FontWeight="Bold"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
        <DataTemplate DataType="data:Employee">
            <Grid Background="LightGreen" >
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
                    <TextBlock Text="{Binding FirstName, StringFormat='\{0\} '}"/>
                    <TextBlock Text="{Binding LastName}"/>
                </StackPanel>
                <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">
                    <TextBlock Text="{Binding Room, StringFormat='Комната: \{0\}'}" FontStyle="Italic"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </Application.Resources>
</Application>

И последний момент, создание тестовых данных в приложении, связывание их с формой

this.DataContext = new List<object>
            {
                new Customer{ FirstName="Иван", LastName="Копаткинский", Company="Топинамбур", Title="Бухгалтер"},
                new Customer{ FirstName="Дмитрий", LastName="Вирутон", Company="Пальма туриста", Title="Менеджер"},
                new Employee{ FirstName="Павел", LastName="Уловинко", Room=101}
            };

и добавление компонента ListBox для отображения списка данных

<Grid x:Name="LayoutRoot" Background="White">
        <ListBox ItemsSource="{Binding}"/>
    </Grid>

Теперь нажимаем F5 и любуемся нашим результатом работы

Скачать пример: