Question

WPF中关于样式和模板的区别

小弟正在学WPF，属于初学者，对两者的概念有点模糊，不知道什么时候该用样式，什么时候该用模板，求高手帮助，最好能有例子。感激不尽！

Answer 1

1.WPF样式
类似于Web应用程序中的CSS，在WPF中可以为控件定义统一的样式(Style)。样式属于资源的一种，例如为Button定义统一的背景颜色和字体：
<Window.Resources>
<Style TargetType="Button">
<Setter Property="Background" Value="Yellow" />
</Style>
</Window.Resources>
<StackPanel>
<Button>Button A</Button>
</StackPanel>
在Style中定义的属性及值，影响到Window中的所有类型为Button的控件的样式
这种样式，类似于CSS中的类型选择器，为某种类型定义样式。
此外还可以在Style中加入x:Key属性，做为特定的样式(注意，这种也需要定义TargetType);
在第一个样式的基础上创建一个新样式可以达到这一目的，如下所示：<Window.Resources>
<Style x:Key="BigFontButtonStyle">
<Setter Property="Control.FontFamily" Value="Times New Roman" />
<Setter Property="Control.FontSize" Value="18" />
<Setter Property="Control.FontWeight" Value="Bold" />
</Style>
<Style x:Key="EmphasizedBigFontButtonStyle" BasedOn="{StaticResource BigFontButtonStyle}">
<Setter Property="Control.Foreground" Value="White" />
<Setter Property="Control.Background" Value="DarkBlue" />
</Style>
</Window.Resources>
以编程方式设置样式，若要以编程方式向元素分配命名样式，请从资源集合中获取该样式，然后将其分配给元素的 Style 属性。请注意，资源集合中的项是 Object
类型，因此，将检索到的样式分配给 Style 属性之前，必须将该样式强制转换为 Style。例如，若要对名为 textblock1 的
TextBlock 设置定义的 TitleText 样式，请执行以下操作：
textblock1.style=(style)Resources["TitleText"];
请注意，样式一旦应用，便会密封并且无法更改。如果要动态更改已应用的样式，必须创建一个新样式来替换现有样式。
2.wpf模板
当一个控件的外观不满足要求的时候，我们可以使用“控件模板”的方式更改控件的外观，WPF中的所有控件，只要有视觉外观，
就会有Template
property，且将此property的值设定为一个ControlTemplate对象。Button之所以看起来像Button就是因为受到了
ControlTemplate对象的直接影响。ControlTemplate对象定义了控件的完整外观，且你可以替换此对象。

抽象的FrameworkTemplate类型只定义了三个property。只读的Boolean
property用来标识此模板是否可以被修改。Resources
property的类型是ResourceDictionary，让我们定义一些只能够在模板内部使用的资源。第三个property最重要，叫做
visualTree，定义组成此控件外观的Element的layout。
ControlTemplate类型多加了两个property定义：TargetType用来指明，哪个类型的控件，适合应用到该模板；Triggers是Trigger对象的collection。

所有派生自ContentControl的类型都使用ContentPresenter类型的对象来显示它们的内容。ContentPresenter派
生自FrameworkElement，你可以在模板的视觉树内包含一个ContentPresenter对象，用来盛放模板中要放置的内容。
ContentPresenter
element负责显示所有“派生自ContentControl”控件的内容。ContentPresenter将这个世界分成两类对
象：UIElement的后代和非UIElement的后代，对于非UIElement的后代，ContentPresenter会调用对象的
ToString方法，用文本来展示该对象。这个功能让“派生自ContentControl”的控件可以用来显示任何种类的内容。
<Window.Resources>
<Style TargetType="Button" x:Key="ButtonStyle">
<!--设置按钮的默认的样式-->
<Setter Property="FontFamily" Value="Comic Sans MS"/>
</Setter>
<!--设置按钮的模板-->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid>
<Ellipse Fill="{TemplateBinding Background}"/>
<ContentPresenter
Margin="5"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<StackPanel>
<Button Margin="5" Style="{StaticResource ButtonStyle}"
Width="100" Height="100"
Content="My Button">
</Button>
<Button Margin="5" Width="200">Common Button</Button>
</StackPanel>。

Answer 2

如果你要修改Control的结构的话，就用 controlTemplate，比如你想在Button里加一个Grid。在修改样式上，style 和 controlTemplate没有什么不同，都是对控件样式进行规范化，最终目的都是修改控件的Template。只不过用controlTemplate时，会在Resources里生成一个static 的ControlTemplate。但是如果是对数据进行规范化，就只能用数据模板了（DataTemplate），Style就不行了。

Answer 3

简单来说如果只需对控件进行小幅度修饰（调整大小、位置、字体、颜色等）就用style，如果需要改变控件的外观和行为就用controlTemplate（形状、事件触发如鼠标停留效果等）。在实际项目中，我们经常把模板（Template）定义在样式（Style）中，通过设置style。
比如：我要做一个用于地图缩放条的图片按钮，这时候通过style调整位置，用controltemplate设置按键形状。
<UserControl.Resources>
<Style x:Key="ZoomUpButton" TargetType="Button">
<Setter Property="Width" Value="23.5" />
<Setter Property="Height" Value="25.5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid Width="23.5" Height="25.5">
<Image Source="/Resource/zoom+.png" Stretch="Fill" />
<ContentPresenter HorizontalAlignment="Center" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect ShadowDepth="2" />
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<Button Style="{StaticResource ZoomUpButton}" />
再给个简单例子：一个带有on/off字样的单选框，选中的时候off字样隐去，没选中的时候on隐去
<Page.Resources>
<ControlTemplate x:Key="switch"TargetType="{x:Type CheckBox}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Border Width="96" Height="48" BorderBrush="Black" BorderThickness="1">
<Canvas Background="LightGray">
<TextBlock Canvas.Left="0" Canvas.Top="0" Foreground="Black" Text="Off" Margin="2" />
<TextBlock Canvas.Right="0" Canvas.Top="0 Foreground="Black" Text="On"
Margin="2" />
<Line Name="lineOff" StrokeThickness="8" Stroke="Black" X1="48" Y1="40"
X2="20" Y2="16" StrokeStartLineCap="Round" StrokeEndLineCap="Round" />
<Line Name="lineOn" StrokeThickness="8"Stroke="Black" X1="48" Y1="40"
X2="76" Y2="16" StrokeStartLineCap="Round" StrokeEndLineCap="Round" Visibility="Hidden" />
</Canvas>
</Border>
<ContentPresenter Grid.Row="1"

Content="{TemplateBinding Content}"

HorizontalAlignment="Center" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked"
Value="True">
<Setter TargetName="lineOff"
Property="Visibility"
Value="Hidden" />
<Setter TargetName="lineOn"
Property="Visibility"
Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Page.Resources>

<CheckBox Template="{StaticResource switch}"
Content="Master Switch"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
你可以在controltemplate中定义复杂的界面，比如：在复杂的treeview中，在controltemplate中定义左边带图片的样式以及右键菜单中，然后再datatemplate中定义层次结构。
实在不好意思，虽然知道一图胜过千言，但截图实在不方便，这两个例子你可以自己运行一下，我也是才学wpf不久，但看了一些英文版的教程后，才慢慢上手，wpf-4-unleashed挺不错的

Answer 4

打个比方吧，，样式就是化妆，，模板就相当于整容了，，，有时候整容才能有更好的效果哈，，