快速浏览Silverlight3 Beta: SystemColor(系统颜色)

概述     原文链接：Silverlight 3 – System Colours             Silverlight 3 中加入了一个名为“SystemColors”类，其包括如下属性;                如果我创建一个Silverlight 应用，并在其中放入一个button（按钮）的话：     < Button              Content ="Click

     原文链接：Silverlight 3 – System Colours  
    
     Silverlight 3 中加入了一个名为“Systemcolors”类，其包括如下属性;
    

     
    如果我创建一个Silverlight 应用，并在其中放入一个button（按钮）的话：  

  < button
             Content ="Click Me"
            FontSize ="24"
            HorizontalAlignment ="Center"
            VerticalAlignment ="Center"   />

            
    会显示如下内容：
    

    
    你会看到在左侧我启动了一个计算器. 如果此时我在windows中修改了我的系统颜色时，比如
使用”高亮对比”这种设置时;

    

    
    这时会显示：
    

    
     也就是计算器和firefox会跟随着系统颜色而变化，但Silverlight 应用却不会。它还是老样子，
不受系统颜色设置的影响.

     如果Silverlight应用能按用户或开发者设想的去应用这些设置（系统颜色）该多好呀。
   
     现在，Systemcolors就可以实现（尽管其仅有少数一些静态属性可以使用，且当用户修改设置时
还无法修改（通知）当前显示界面等等）。    
  
     不过，我认为如果用户刷新浏览器的话（或可以点击Silverlight UI上的一个按钮来通知当前应用
已修改了windows主题的话），这些就不是什么主要的缺失了。It’s liveable.

    抱着这种想法，我打算显露出Systemcolors的一些静态属性，将其作为非静态属性以便于在XAML
使用.

    下面这是相关的尝试 :-)
   

public   class  MySystemColours
{
   public  Brush ControlTextBrush
  {
     get
    {
       if  (controlTextBrush  ==   null )
      {
        controlTextBrush  =   new  SolIDcolorBrush(Systemcolors.ControlTextcolor);
      }
       return  (controlTextBrush);
    }
  }
  Brush controlTextBrush;
}

  

     而相应的Xaml内容如下：   

< UserControl
     x:Class ="SilverlightApplication36.MainPage"
    xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local ="clr-namespace:SilverlightApplication36" >
     < UserControl.Resources >
         < local:MySystemColours  x:Key ="mySystemColours"   />
     </ UserControl.Resources >
     < GrID
         x:name ="LayoutRoot" >
         < GrID.Resources >
         </ GrID.Resources >
         < button
             Foreground =" {Binding Source={StaticResource mySystemColours},Path=ControlTextBrush} "
            Content ="Click Me"
            FontSize ="24"
            HorizontalAlignment ="Center"
            VerticalAlignment ="Center"   />
     </ GrID >
</ UserControl >

     现在，看上去已经差不多了。但我并不真想在每个控件实现上显式的设置“Foreground”和
“Background”属性，我想用一个Style来实现。
     那么，我可能要创建一个Style，其使用了诸如ControlTextBrush等的brushes，以便于应用到
buttons,CheckBoxes等等UI元素上.

    这也就导致了我的第二个尝试，其 XAML代码如下;

 

< UserControl
     x:Class ="SilverlightApplication36.MainPage"
    xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local ="clr-namespace:SilverlightApplication36" >
     < UserControl.Resources >
         < local:MySystemColours  x:Key ="mySystemColours"   />
         < Style
             x:Key ="mySystemStyle"
            targettype ="button" >
             < Setter
                 Property ="Foreground"
                Value =" {Binding Source={StaticResource mySystemColours},Path=ControlTextBrush} "   />
         </ Style >
     </ UserControl.Resources >
     < GrID
         x:name ="LayoutRoot" >
         < GrID.Resources >
         </ GrID.Resources >
         < button
             Style =" {StaticResource mySystemColours} "
            Content ="Click Me"
            FontSize ="24"
            HorizontalAlignment ="Center"
            VerticalAlignment ="Center"   />
     </ GrID >
</ UserControl >

    除了不能实际运行，其它看起来还都不错 :-) 问题在于我要在绑定一个 Brush值。但在Silverlight
中你不能绑定这个Brushes或 colors值,你只能将这些绑定应用到从FrameworkElement派生出来的元素上。
在这个论坛中有相关的主题，如果别人有不同的做法请通知我，以便我能够及时了解到.
  
    那该怎么办呢?
   
    好吧,我们可以数据绑定方式来为Styles设置Brush和color，但却不能数据绑定setters。也许我能在
运行时创建一个完整的style 并添加这些属性(到元素中);

public   class  MySystemStyles
  {
     public  Style buttonStyle
    {
       get
      {
         if  (buttonStyle  ==   null )
        {
          buttonStyle  =  MakeStyle( typeof (button));
        }
         return  (buttonStyle);
      }
    }
     static  Style MakeStyle(Type t)
    {
      Style style  =   new  Style(t);

       foreach  (var item  in  propertIEsValues)
      {
        style.Setters.Add( new  Setter(item.Key, item.Value));
      }
       return  (style);
    }
     static  Dictionary < DependencyProperty,  object >  propertIEsValues  =
       new  Dictionary < DependencyProperty,  object > ()
      {
        { Control.ForegroundProperty,  new  SolIDcolorBrush(Systemcolors.ControlTextcolor) },
        { Control.BackgroundProperty,  new  SolIDcolorBrush(Systemcolors.Controlcolor) }
      };

    Style buttonStyle;
  }

  
  
     现在，除了默认的button模版不依赖于Foreground 和 Background 之外，活干的差不多了。
它可以使用更多的颜色和一个borderBrush，但也有一些颜色在button的属性上是无效的。具我
所知也就能修改这两种属性.

     我需要另外一个button版本，其使用Foreground,Background 和 borderBrush. 那我要如何
组合这个style呢？

     我想到可以使用BasedOn style，其XAML如下;
   

< UserControl.Resources >
      < local:MySystemStyles
          x:Key ="mySystemStyles"   />
      < Style
          x:Key ="buttonStyle"
         BasedOn =" {Binding Source={StaticResource mySystemStyles},Path=buttonStyle} " >

         
     在运行时无法工作( BasedOn 绑定时IE报错).

     也许可以变换一下思路，当它在运行时创建一个style时，我可以通知 MySystemStyles 类。它应该
基于当前的style。看起来有些麻烦但却可行;

public   class  MySystemStyles
{
   public  Style BasedOnbuttonStyle
  {
     get
    {
       return  (basedOnbuttonStyle);
    }
     set
    {
      basedOnbuttonStyle  =  value;
    }
  }    
   public  Style buttonStyle
  {
     get
    {
       if  (buttonStyle  ==   null )
      {
        buttonStyle  =  MakeStyle( typeof (button), basedOnbuttonStyle, buttonPropertyValues);
      }
       return  (buttonStyle);
    }
  }
   static  Style MakeStyle(Type t, Style basedOnStyle, Dictionary & lt;DependencyProperty,  object & gt; propertyValues)
  {
    Style style  =   new  Style(t);

    style.BasedOn  =  basedOnStyle;

     foreach  (var item  in  propertyValues)
    {
      style.Setters.Add( new  Setter(item.Key, item.Value));
    }
     return  (style);
  }
   static  Dictionary & lt;DependencyProperty,  object & gt; buttonPropertyValues  =
     new  Dictionary & lt;DependencyProperty,  object & gt;()
    {
      { Control.ForegroundProperty,
      { Control.BackgroundProperty,  new  SolIDcolorBrush(Systemcolors.Controlcolor) },
      { button.borderBrushProperty,  new  SolIDcolorBrush(Systemcolors.Activebordercolor) }
    };

  Style buttonStyle;
  Style basedOnbuttonStyle;
}

 

     相应的XAML 如下;

< UserControl
     x:Class ="SilverlightApplication36.MainPage"
    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:SilverlightApplication36" >
     < UserControl.Resources >
         < Style
             x:Key ="buttonStyle"  targettype ="button" >
             < Setter
                 Property ="Template" >
                 < Setter.Value >
                     < ControlTemplate
                         targettype ="button" >
                         < GrID >
                             < vsm:visualstatemanager.VisualStateGroups >
                                 < vsm:VisualStateGroup
                                     x:name ="CommonStates" >
                                     < vsm:VisualState
                                         x:name ="normal"   />
                                     < vsm:VisualState
                                         x:name ="MouSEOver" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames
                                                 Storyboard.Targetname ="BackgroundAnimation"
                                                Storyboard.TargetProperty ="Opacity" >
                                                 < SplineDoubleKeyFrame
                                                     KeyTime ="0"
                                                    Value ="1"   />
                                             </ DoubleAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ vsm:VisualState >
                                     < vsm:VisualState
                                         x:name ="pressed" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames
                                                 Storyboard.Targetname ="BackgroundAnimation"
                                                Storyboard.TargetProperty ="Opacity" >
                                                 < SplineDoubleKeyFrame
                                                     KeyTime ="0"
                                                    Value ="1"   />
                                             </ DoubleAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ vsm:VisualState >
                                     < vsm:VisualState
                                         x:name ="Disabled" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames
                                                 Storyboard.Targetname ="DisabledVisualElement"
                                                Storyboard.TargetProperty ="Opacity" >
                                                 < SplineDoubleKeyFrame
                                                     KeyTime ="0"
                                                    Value =".55"   />
                                             </ DoubleAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ vsm:VisualState >
                                 </ vsm:VisualStateGroup >
                                 < vsm:VisualStateGroup
                                     x:name ="Focusstates" >
                                     < vsm:VisualState
                                         x:name ="Focused" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames
                                                 Storyboard.Targetname ="FocusVisualElement"
                                                Storyboard.TargetProperty ="Opacity" >
                                                 < SplineDoubleKeyFrame
                                                     KeyTime ="0"
                                                    Value ="1"   />
                                             </ DoubleAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ vsm:VisualState >
                                     < vsm:VisualState
                                         x:name ="Unfocused"   />
                                 </ vsm:VisualStateGroup >
                             </ vsm:visualstatemanager.VisualStateGroups >
                             < border
                                 x:name ="Background"
                                Background =" {TemplateBinding Background} "
                                borderBrush =" {TemplateBinding borderBrush} "
                                borderThickness =" {TemplateBinding borderThickness} "
                                CornerRadius ="3" >
                                 < GrID
                                     margin ="1"
                                    Background =" {TemplateBinding Background} " >
                                     < border
                                         x:name ="BackgroundAnimation"
                                        Opacity ="0"
                                        Background =" {TemplateBinding Background} "   />
                                 </ GrID >
                             </ border >
                             < ContentPresenter
                                 x:name ="contentPresenter"
                                HorizontalAlignment =" {TemplateBinding HorizontalContentAlignment} "
                                margin =" {TemplateBinding padding} "
                                VerticalAlignment =" {TemplateBinding VerticalContentAlignment} "
                                Content =" {TemplateBinding Content} "
                                ContentTemplate =" {TemplateBinding ContentTemplate} "   />
                             < Rectangle
                                 x:name ="DisabledVisualElement"
                                Fill ="#FFFFFFFF"
                                RadiusX ="3"
                                RadiusY ="3"
                                IsHitTestVisible ="false"
                                Opacity ="0"   />
                             < Rectangle
                                 x:name ="FocusVisualElement"
                                stroke =" {TemplateBinding borderBrush} "
                                strokeThickness ="1"
                                RadiusX ="2"
                                RadiusY ="2"
                                margin ="1"
                                IsHitTestVisible ="false"
                                Opacity ="0"   />
                         </ GrID >
                     </ ControlTemplate >
                 </ Setter.Value >
             </ Setter >
         </ Style >
         < local:MySystemStyles
             x:Key ="mySystemStyles"  
            BasedOnbuttonStyle =" {StaticResource buttonStyle} " />
     </ UserControl.Resources >
     < GrID
         x:name ="LayoutRoot" >
         < GrID.Resources >
         </ GrID.Resources >
         < button
             Style =" {Binding Source={StaticResource mySystemStyles},Path=buttonStyle} "
            Content ="Click Me"
            FontSize ="24"
            HorizontalAlignment ="Center"
            VerticalAlignment ="Center"   />
     </ GrID >
</ UserControl >

 

     现在，它可以按我起初的想法，很好的运行了。当我在windows中修改我的颜色主题时并刷新当前的
Silverlight 应用，按钮会去获取已修改的系统颜色.

     但是，目前在按钮上只有三个属性可以设置. 我需要为每个控件设置一系列的styles，然后再去扩展
MySystemStyles 类，诸如一些：ComboBoxStyle,TreeVIEwStyle,TextBoxStyle 属性等等。它也
必须包括诸如BasedOnComboBoxStyle 或 BasedOnTreeVIEwStyle属性等等.

    哎…虽然可以工作，但应该还有更好的变法吧?

    Anyone got IDeas? :-)
   
   
   
    原文链接:http://www.cnblogs.com/daizhj/archive/2009/05/06/1450455.html

    译者: daizhj,代震军

    Tags: silverlight,system color,系统主题,theme
   
    网址: http://daizhj.cnblogs.com/

@H_301_2070@ 总结

以上是内存溢出为你收集整理的快速浏览Silverlight3 Beta: SystemColor(系统颜色)全部内容，希望文章能够帮你解决快速浏览Silverlight3 Beta: SystemColor(系统颜色)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。