Looking at Triggers with Styles and Control Templates (Page 1 of 4 )
Continuing our discussion from yesterday, we'll cover data templates and various kinds of triggers. This article is excerpted from chapter five of the book
Programming Windows Presentation Foundation, written by Chris Sells and Ian Griffiths (O'Reilly; ISBN: 0596101139). Copyright © 2006 O'Reilly Media, Inc. All rights reserved. Used with permission from the publisher. Available from booksellers or direct from O'Reilly Media.
Data Templates
Recall from Chapter 4 that WPF allows you to define a data template, which is a tree of elements to expand in a particular context. Data templates are used to provide an application with the ability to render non-visual objects, as shown in Example 5-22.
Example 5-22. Setting a PlayerMove data template without styles
<?Mapping XmlNamespace="l" ClrNamespace="TicTacToe" ?>
<Window ... xmlns:local="local">
<Window.Resources>
<DataTemplate DataType="{x:Type local:PlayerMove}">
<Grid>
<TextBlock
TextContent="{Binding Path=PlayerName}"
FontSize ="32"
FontWeight="Bold"
VerticalAlignment="Center"
HorizontalAlignment="Center" />
<TextBlock
TextContent="{Binding Path=MoveNumber}"
FontSize="16"
FontStyle="Italic"
VerticalAlignment="Bottom"
HorizontalAlignment="Right" />
</Grid>
</DataTemplate>
...
</Window.Resources>
...
</Window>
Using the XAML mapping syntax introduced in Chapter 1, we’ve mapped thePlayerMovertype into the XAML with the mapping directive and thexmlnsattribute, which we’ve used as the data type of the data template. Now, whenever WPF sees aPlayerMove object, such as the content of all of our buttons, the data template will be expanded. In our case, the template consists of a grid to arrange two text blocks, one showing the player name in the middle of the button and one showing the move number in the bottom right, along with some other settings to make things pretty.
Data Templates with Style
However, these property settings are buried inside a data template several layers deep. Just as it’s a good idea to take “magic numbers” out of your code, pulling them out and giving them names for easy maintenance, it’s a good idea to move groups of settings into styles,* as in Example 5-23.
Example 5-23. Setting a PlayerMove data template with styles
<Window.Resources>
<Style x:Key="CellTextStyle" TargetType="{x:Type TextBlock}">
<Setter Property="FontSize" Value="32" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="HorizontalAlignment" Value="Center" />
</Style>
<Style x:Key="MoveNumberStyle" TargetType="{x:Type TextBlock}">
<Setter Property="FontSize" Value="16" />
<Setter Property="FontStyle" Value="Italic" />
<Setter Property="VerticalAlignment" Value="Bottom" />
<Setter Property="HorizontalAlignment" Value="Right" />
</Style>
<DataTemplate DataType="{x:Type l:PlayerMove}">
<Grid>
<TextBlock
TextContent="{Binding Path=PlayerName}"
Style="{StaticResource CellTextStyle}" />
<TextBlock
TextContent="{Binding Path=MoveNumber}"
Style="{StaticResource MoveNumberStyle}" />
</Grid>
</DataTemplate>
</Window.Resources>
It’s common to use styles, which set groups of properties, with data templates, which create groups of elements that have groups of properties. Figure 5-7 shows the result.
Figure 5-7. Showing objects of a custom type using templates and styles
Still, as nice as Figure 5-7 is, the interaction is kind of boring given the capabilities of WPF. Let’s see what we can do with style properties as the application is used.
Next: Triggers >>
More XML Articles
More By O'Reilly Media
|
 This article is excerpted from chapter five of the book Programming Windows Presentation Foundation, written by Chris Sells and Ian Griffiths (O'Reilly; ISBN: 0596101139). Check it out today at your favorite bookstore. Buy this book now.
|
|
/ 3 
