自定义控件

来源:转载

基础skim:

修改控件的外观有两种方式:(1)通过样式。(2)修改模版。对于(1)样式就不说了,重点是(2),您可以通过修改或替换控件的ControlTemplate来完全替换控件的外观。自定义控件协定的实现体现在三个方面:部件、状态(组)、可视状态。创建控件时建议遵循此 部件&状态模型。那么,何为部件呢?我们来拆分ComboBox控件。如图:

部件 状态

 

ComboBox有5个命名部件,每个部件都由控件代码以编程的方式访问,例如当按下DropDownToggle时,弹出Popup并显示所有的项,单击某项时,该项将显示在ContentPresenter中。

可视转换是指当控件从一个状态进入另一个状态时控件的可视外观。

切入正题:

控件的属性来设置控件的外观是有限的,通过ControlTemplate能做设置属性来改变外观不能做的事情。方法是通过控件的Template属性来指定ControlTemplate,有3钟方式来设置Template属性的值:(1)内联定义ControlTemplate。(2)对ControlTemplate资源的引用。(3)对ControlTemplate Style样式的引用。

1 <Button Content="Custom">

2             <Button.Template>

3                 <ControlTemplate TargetType="Button">4                     <!--Define you content here-->
5                 </ControlTemplate>
6             </Button.Template>
7  </Button>

 

1 <Grid x:Name="LayoutRoot" Background="White">
2         <Grid.Resources>
3             <ControlTemplate x:Key="myCT" TargetType="Button">
4                 <!--Define you content here-->
5             </ControlTemplate>
6         </Grid.Resources>
7         <Button Content="Custom" Template="{StaticResource myCT}"/>
8 </Grid>

 

 1 <Grid x:Name="LayoutRoot" Background="White">
 2         <Grid.Resources>
 3             <ControlTemplate x:Key="myCT" TargetType="Button">
 4                 <!--Define you content here-->
 5             </ControlTemplate>
 6             <Style x:Key="myStyle" TargetType="Button">
 7                 <Setter Property="Template">
 8                     <Setter.Value>
 9                         <ControlTemplate TargetType="Button">
10                             <!--Define you content here-->
11                         </ControlTemplate>
12                     </Setter.Value>
13                 </Setter>
14             </Style>
15         </Grid.Resources>
16         <Button Content="Custom" Style="{StaticResource myStyle}"/>
17  </Grid>

修改默认外观的按钮之后,当按钮处于不同的状态时(MouseHover,MouseDown)不会有相应的外观变化。所以我们需要根据控件的状态更改控件的外观。使用VisualState对象来指定控件处于特定状态下的外观,VisualState包含Storyboard。无需对Storyboard做任何操作,它是由VisualStateManager来更改状态,当控件进入VisualState.Name属性指定的状态时,Storyboard开始工作,当控件退出该状态时,Storyboard停止工作。

本文来自黑择明的博客,原文地址:http://www.cnblogs.com/vicer/archive/2011/06/01/2066064.html


分享给朋友:
您可能感兴趣的文章:
随机阅读: