Sliverlight模板中控件的样式变化

 

 在 运用Silverlight的过程当中，遇到一些关于模板控件的样式问题，相信用Silverlight做过DEMO的都会用到一些定义好的模板控件，这 样的控件的样式如果是在模板中已经定义好的话，那么在运行起来后就很难去改变，当然你也可以运用silverglight Toolkit中已经定义好的一些颜色样式来进行一些基本的样式控制，但是如果你需要的颜色，字体并不在其中的话，那么你就需要自己来实现这个功能，而且 这样也更有利于灵活的控制，下面我列举了在运行起来后仍然可以改变样式的几个方法：

 

方法一： Series Template（系列模板）， 顾名思义，也就是我们会根据需要的颜色等属性的不同建立相对应一系列的模板，如：现在有三种颜色红、绿、蓝，那么我们可以定义一个系列模板代码如下，

<UserControl.Resources>

 <ControlTemplate x:Key="BtnRed" TargetType="Button">
            .....可以定义好颜色、字体等属性
 </ControlTemplate>

 <ControlTemplate x:Key="BtnGreen" TargetType="Button">
            .....
 </ControlTemplate>

 <ControlTemplate x:Key="BtnBlue" TargetType="Button">
            .....
 </ControlTemplate>

</UserControl.Resources>

在页面当中我们会有一个Button应用这些模板，如下：

<Button Height="50" Margin="115,0,115,-5" x:Name="BtnTest" Template="{StaticResource BtnRed}" VerticalAlignment="Bottom" Content="Button" Cursor="Hand" IsEnabled="False" Click="BtnTest_Click"/>

 
然后在我们需要颜色改变的时候替换模板，比如我有一个颜色选择器，当我改变选择器的颜色的时候我们就可以根据颜色改变该Button所运用的模板，如下：

public void SwitchColor(string ColorName)
{
        (BtnTest.Template=(ControlTemplate)this.Resources["Btn"+ ColorName];)
}

这样我们就完成了一个模板控件的样式了。


方法二：TemplateBinding 模板绑定方式： 如Button 有Foreground、Background之类的属性，那么在模板中可以定义同样的属性如：

<Style x:Key="BtnComButton" TargetType="Button">

            <Setter Property="Background" Value="#FF1F3B53"/>

            <Setter Property="Foreground" Value="#FF000000"/>

//而在模板中应用的时候就用TemplateBinding 的方式

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

      <GradientStop Color="{TemplateBinding Background}" Offset="0"/>

      <GradientStop Color="{TemplateBinding Foreground}" Offset="1"/>

</LinearGradientBrush>

</Style>

如果有个一个Button用到此Style 如：

<Button Content="OK" Template="{StaticResource BtnComButtonSlate}">

  <Button.Foreground>

    <SolidColorBrush x:Name="btnUnlikeForeground" Color="{StaticResource RedColor}"/>

  </Button.Foreground>

  <Button.Background>

    <SolidColorBrush x:Name="btnUnlikeBG"  Color="{StaticResource GreenColor}"/>

  </Button.Background>

</Button>

那么在后台改变颜色的时候，我们就可以随时改变btnUnlikeForeground 和btnUnlikeBG 的颜色了，如：

public void BackColor_Changed(Color color)
{         
      btnUnlikeForeground.Color = color;

      btnUnlikeBG.Color = color;
}

通 过以上方法，我们就可以在运行时改变这个Buton的样式了，但是请注意，并不是每个属性都能这样设置，如果Button或者你将会要运用style的控 件它并没有在样式中定义的一些属性，那么以上的方法是无效的，也就是说在style中定义的一些属性，必须是你将要应用到控件中它本身存在的属性，当然如 果你继承了那个控件的话那就另说了。

 

方法三： Themes  需要建立一个Themes 文件夹，然后在其中建立相应的theme文件，这个就类似于CSS形式，见图：

其中generic.xml 文件比较特殊，请看下面的代码

<ResourceDictionary

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"

xmlns:local="clr-namespace:CS_Controls.BtnCommandButton ">

<ControlTemplate TargetType="local: BtnCommandButton">

    <Style TargetType="Button">

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType=" local: BtnComButton ">

                    <Grid>

<TextBlock x:Name="ButtonTitle"/>

                      ....

</ResourceDictionary>

那么BtnComButton 如何定义呢，我们需要建立一个自定义控件BtnComButton如下:

public class BtnComButton: Control
{
   private TextBlock textTitle;

   public BtnComButton (){}

   public override void OnApplyTemplate()

   {    //此方法是在控件Initialize的时候执行

        base.OnApplyTemplate();

        textTitle = base.GetTemplateChild("ButtonTitle") as TextBlock;
    }
}

这 样我们可以直接获取到模板里面的控件，也可以给自定义控件添加上更多的属性来适应我们的需求，麻烦的是所有用到模板的控件需要重新写，而且暂时还没有能找 到及时改变颜色的解决方法，因为这种方法只是在BtnComButton对象初始化的时候就确定好了其颜色等其他属性，还不能随时进行改变。

 

以上几种方法都能够实现我们在Silverlight运行时改变模板控件样式的问题，当然这几个不一定是最好的方法，现在我所运用的就是另外一种方式，但是也感觉是比较奇怪的方式，下一篇文章会来介绍这个方法。