首页 > 代码库 > WP8.1 UI 编程 二、样式和模板
WP8.1 UI 编程 二、样式和模板
1. 每个控件都有一个Resources属性，把样式放在这个Resources里，就可以作为静态资源给这个控件的可视化树下的控件使用。如果定义在Page上，则整个页面都可以使用；同样Application上整个App都可以使用。
Style的TargetType属性不一定要和使用这个样式的控件类保持一致，可以设置为它的父类。例如，设置为FrameworkElement也可以被TextBlock使用。
要Style实现继承，只需设置它的BasedOn属性。
Style可以以编程方式动态创建和设置。
Style应用后就无法修改，要更改已应用样式的控件的样式，必须设置为另一个样式。
Style可以单独写在XAML文件里，如：
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <!--这里就可以写Style了--></ResourceDictionary>
要添加所需的Style，只需在相关Resources属性下添加：
<ResourceDictionary> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="样式XAML的URI"/> </ResourceDictionary.MergedDictionaries></ResourceDictionary>
系统主题资源在：C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v8.1\Design
如何实现简单的自定义/多主题？
WP的主题资源是可以在代码中动态修改的，直接修改就可以实现。
2. 模板分为ControlTemplate和DataTemplate。
ControlTemplate可以通过修改控件内部的可视化树结构，来完成定制控件内部的布局和内容。只需将声明的ControlTemplate对象赋值给控件的Template属性。
使用TemplateBinding语法可以将ControlTemplate中的元素属性与控件本身的属性关联。
ControlPresenter，用来显示ContentControl及其子类（如Button）的Content属性。Content属性是object类型。
当定义了Content属性后，把它投影到ControlPresenter的Content属性，就可以显示Content内容了。
下面是例子，代码直接复制的，废话比较多。
<Button > <Button.Template> <ControlTemplate > <Grid> <Ellipse Width="{TemplateBinding Button.Width}" Height="{TemplateBinding Control.Height}" Fill="{TemplateBinding Button.Background}" Stroke="Red"/> <TextBlock Margin="5,0,0,0" FontSize="50" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Button.Content}" /> <TextBlock FontSize="50" Foreground="Red" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{TemplateBinding Button.Content}" /> <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> </Grid> </ControlTemplate> </Button.Template> <Button.Content> <Rectangle Fill="Red" Height="50" Width="50"></Rectangle> </Button.Content> </Button>
VisualStatesManager可管理控件的视觉状态（比如Button点按的视觉效果）。
在控件上设置VisualStatesManager.VisualStateGroups属性来添加视觉状态组。
VisualState：视觉状态（如Button默认就包括Normal、MouseOver等6种状态），主要使用它来自定义。
VisualStateGroup.Transitions：切换视觉状态的过渡动画，可选。
示例：
<VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualStateGroup.Transitions> <!--状态Test1转化为状态Test2的颜色变化动画--> <VisualTransition From="Test1" To="Test2" GeneratedDuration="0:0:1.5"> <Storyboard> <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="Color" Storyboard.TargetName="BorderBrush" FillBehavior="HoldEnd" > <ColorAnimationUsingKeyFrames.KeyFrames> <LinearColorKeyFrame Value="Blue" KeyTime="0:0:0.5" /> <LinearColorKeyFrame Value="Yellow" KeyTime="0:0:1" /> <LinearColorKeyFrame Value="Black" KeyTime="0:0:1.5" /> </ColorAnimationUsingKeyFrames.KeyFrames> </ColorAnimationUsingKeyFrames> </Storyboard> </VisualTransition> </VisualStateGroup.Transitions> <!--创建状态Test1，把Border背景的颜色改成红色--> <VisualState x:Name="Test1"> <Storyboard> <ColorAnimation Storyboard.TargetName="BorderBrush" Storyboard.TargetProperty="Color" To="Red" /> </Storyboard> </VisualState> <!--创建状态Test2把Border背景的颜色改成蓝色--> <VisualState x:Name="Test2"> <Storyboard > <ColorAnimation Storyboard.TargetName="BorderBrush" Storyboard.TargetProperty="Color" To="Blue" /> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups>
然后在相关事件中使用VisualStatesManager.GoToState方法。
DataTemplate用于描述数据对象的视觉样式，通常需要与ControlTemplate合作来完成一些工作。要关联绑定数据对象的属性，使用Binding语法。
ContentControl类是内容控件的基类。内容控件都具有Content属性，如Button；
ItemsControl类是列表控件的基类。列表控件，如ListBox。
ContentControl是单项的，ItemsControl是多项的。
继承自ContentControl的控件的ControlTemplate属性，和继承自ItemsControl的控件的ItemTemplate属性，其类型都是DataTemplate。
DataTemplate经常像Style那样，作为静态资源供多个控件来使用。
ItemsControl的DataTemplate是直接投影在ItemsPresenter上的，在定义ControlTemplate时，内部的ItemsPresenter就是DataTemplate。
如何实现更换复杂的自定义主题？动态读取更换控件的DataTemplate就可以了。
WP8.1 UI 编程 二、样式和模板