Windows Phone 四、控件模版

控件模版的概念

Windows Phone中每一个控件都有一个默认的模版，用于描述控件的内部组成结构和外观样式

相对于原本的样式外观操作，自定义模版的可自定义性更强

最基本的重写控件模版

     <Grid>
         <!--Button按钮居中对齐-->
         <Button HorizontalAlignment="Center">
             <!--原生控件模版设置的就是Template属性-->
             <Button.Template>
                 <!--控件模版类型-->
                 <ControlTemplate>
                     <!--Border本身支持圆角-->
                     <Border
                         BorderBrush="White"
                         BorderThickness="3"
                         CornerRadius="10,20,10,10">
                         <TextBlock
                             Text="Button"
                             TextAlignment="Center"
                             VerticalAlignment="Center"/>
                     </Border>
                 </ControlTemplate>
             </Button.Template>
         </Button>
     </Grid>

BorderBrush 颜色　　BorderThickness 边框宽度　　CornerRadius 四个圆角的弧度

Text 内容　　TextAlignment 水平对齐方式　　VerticalAlignment 垂直对齐方式

绑定属性和重用（自定义控件模版）

     <Page.Resources>
         <!--圆角Button模版-->
         <ControlTemplate x:Key="CornerButton" TargetType="Button">
             <!--Border本身支持圆角-->
             <Border
                         Background="{TemplateBinding Button.Background}"
                         BorderBrush="{TemplateBinding Button.BorderBrush}"
                         BorderThickness="{TemplateBinding Button.BorderThickness}"
                         CornerRadius="10,20,10,10">
                 <!--TemplateBinding是用来在模版中绑定当前控件属性-->
                 <TextBlock
                             Text="{TemplateBinding Button.Content}"
                             TextAlignment="Center"
                             VerticalAlignment="Center"/>
             </Border>
         </ControlTemplate>
         <!--统一所有按钮-->
         <Style TargetType="Button">
             <Setter Property="Template" Value="{StaticResource CornerButton}"/>
         </Style>
     </Page.Resources>
     <Grid>
         <!--圆角Button模版，资源引用-->
         <Button
             Content="Button"
             Background="Aqua"
             BorderBrush="HotPink"
             BorderThickness="15"
             HorizontalAlignment="Center"
             Template="{StaticResource CornerButton}">
         </Button>
     </Grid>

图标按钮展示内容

Button派生自ContentControl，所有ContentControl都是由ContentPersenter展示Content属性

     <Grid>
         <Button>
             <Button.Content>
                 <SymbolIcon Symbol="Accept"/>
             </Button.Content>
             <Button.Template>
                 <ControlTemplate>
                     <Border
                         BorderBrush="White"
                         BorderThickness="3" CornerRadius="10">
                         <ContentPresenter/>
                     </Border>
                 </ControlTemplate>
             </Button.Template>
         </Button>
     </Grid>