Главная » Разработка для Windows Phone 7 » Эти замечательные шаблоны данных Windows Phone 7

0

Оставшуюся часть данной главы я хочу посвятить ItemsControl и сосредоточиться исключительно на представлении и навигации, отложив в сторону выбор. Для работы нам понадобится новый проект. Включим в него ссылку на библиотеку ElPasoHighSchool и в XAML-файле добавим объявление пространства имен XML для этой библиотеки, и также создадим экземпляр класса StudentBodyPresenter в коллекции Resources, как в предыдущем приложении. Рассмотрим ItemsControl, который помещен в ScrollViewer, заполняющий весь Grid для содержимого:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"

DataContext="{Binding Source={StaticResource studentBodyPresenter}, Path=StudentBody}">

<ScrollViewer>

<ItemsControl ItemsSource="{Binding Students}" DisplayMemberPath="FullName" />

</ScrollViewer>

Замена DisplayMemberPath на DataTemplate позволит обеспечить расширенное и лучше отформатированное отображние сведений:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> <ScrollViewer>

<ItemsControl ItemsSource="{Binding Students}"> <ItemsControl.ItemTemplate> <DataTemplate>

<Border BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="1" CornerRadius="12" Margin="2"> <Grid>

<Grid.RowDefinitions>

<RowDefinition Height="*" /> <RowDefinition Height="*" /> </Grid.RowDefinitions>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions>

<Image Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Source="{Binding PhotoFilename}" Height="12 0" Width="90" Margin="6" />

<StackPanel Grid.Row="0" Grid.Column="1" Orientation="Horizontal" VerticalAlignment="Center"> <TextBlock Text="{Binding LastName}" /> <TextBlock Text=", " />

<TextBlock Text="{Binding FirstName}" /> <TextBlock Text=", " />

</Grid>

ScrollViewer обеспечивает возможность прокручивать содержимое:

<TextBlock Text="{Binding MiddleName}" /> </StackPanel>

<StackPanel Grid.Row="1" Grid.Column="1" 0rientation="Horizontal" VerticalAlignment="Center"> <TextBlock Text="Grade Point Average = " /> <TextBlock Text="{Binding GradePointAverage}" /> </StackPanel> </Grid> </Border> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> </ScrollViewer> </Grid>

В данном шаблоне высота отдельных элементов зависит от явно заданного параметра Height элемента Image. Чтобы предотвратить перемещение текста вправо при загрузке изображения, явно задается и параметр Width. В результате получаем следующее:

Источник: Чарльз Петзольд, Программируем Windows Phone 7, Microsoft Press, © 2011.

По теме:

  • Комментарии