[Silverlight] Mac OS 风格按钮 Style 实现的更新版（针对 Silverlight 2 RTW)

在 Silverlight 2 beta 2 时，我曾经写了一篇帖子实现了苹果风格的按钮样式（Silverlight 下苹果(Mac OS)风格按钮的实现 ）。

而现在 Silverlight 2 终于发布了，也给之前的代码带来了很多问题，导致无法继续使用。

经过一阵探索，我终于成功修改了这个代码，现在在正式版下也能工作正常了。其关键点如下：

1. 在 beta 2 时，需要采用 <vsm:Setter> 和 <vsm:Style> 的语法编写样式。其中 vsm 是个名称空间引用：
xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
而正式版下直接用 <Style> 和 <Setter> 表签即可。
这个问题如果不修改，程序可以编译通过，但是运行时会报一个莫名其妙的“AG_E_PARSER_PROPERTY_NOT_FOUND”错误。

2. ContentPresenter 和 ContentControl 控件删除了如下属性：
TextDecorations,
TextWrapping,
TextAlignment.

因此，现在必须在 template 中将 ContentPresenter 的定位改用容器 Button 的 HorizontalContentAlignment 和 VerticalContentAlignment 属性来控制。代码如下：

< ContentPresenter Margin ="4,5,4,4" Content ="{TemplateBinding Content}" ContentTemplate ="{TemplateBinding ContentTemplate}" HorizontalAlignment ="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

修改成功后的 Style 全部代码如下：

< UserControl
     x:Class ="UserControl"
    xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable ="d"
    d:DesignWidth ="640"  d:DesignHeight ="480" >

     < UserControl.Resources >
         < Style  x:Key ="MyButton"  TargetType ="Button" >
             < Setter  Property ="IsEnabled"  Value ="true" />
             < Setter  Property ="IsTabStop"  Value ="true" />
             < Setter  Property ="Background"  Value ="#FF003255" />
             < Setter  Property ="Foreground"  Value ="#FF313131" />
             < Setter  Property ="MinWidth"  Value ="5" />
             < Setter  Property ="MinHeight"  Value ="5" />
             < Setter  Property ="Margin"  Value ="0" />
             < Setter  Property ="HorizontalContentAlignment"  Value ="Center" />
             < Setter  Property ="VerticalContentAlignment"  Value ="Center" />
             < Setter  Property ="Cursor"  Value ="Arrow" />
             < Setter  Property ="FontSize"  Value ="11"   />
             < Setter  Property ="Template" >
                 < Setter.Value >
                     < ControlTemplate  TargetType ="Button" >
                         < Grid >
                             < Grid.Resources >
                                 < Color  x:Key ="LinearBevelLightStartColor" > #FFFFFFFF </ Color >
                                 < Color  x:Key ="LinearBevelLightEndColor" > #F4E2E0E0 </ Color >
                                 < Color  x:Key ="LinearBevelDarkStartColor" > #E0E5E5E5 </ Color >
                                 < Color  x:Key ="LinearBevelDarkEndColor" > #B2FFFFFF </ Color >
                                 < Color  x:Key ="MouseOverLinearBevelDarkEndColor" > #7FFC1717 </ Color >
                                 < Color  x:Key ="HoverLinearBevelLightStartColor" > #FCFFFFFF </ Color >
                                 < Color  x:Key ="HoverLinearBevelLightEndColor" > #EAFFFFFF </ Color >
                                 < Color  x:Key ="HoverLinearBevelDarkStartColor" > #D8FFFFFF </ Color >
                                 < Color  x:Key ="HoverLinearBevelDarkEndColor" > #4CFFFFFF </ Color >
                                 < Color  x:Key ="CurvedBevelFillStartColor" > #B3FFFFFF </ Color >
                                 < Color  x:Key ="CurvedBevelFillEndColor" > #3CFFFFFF </ Color >
                                 < SolidColorBrush  x:Key ="BorderBrush"  Color ="#FF5E5E5E" />
                                 < SolidColorBrush  x:Key ="AccentBrush"  Color ="#FF000000" />
                                 < SolidColorBrush  x:Key ="DisabledBrush"  Color ="#A5FFFFFF" />
                                 < LinearGradientBrush  x:Key ="FocusedStrokeBrush"  EndPoint ="0.5,1"  StartPoint ="0.5,0" >
                                     < GradientStop  Color ="#B2FFFFFF"  Offset ="0" />
                                     < GradientStop  Color ="#51FFFFFF"  Offset ="1" />
                                     < GradientStop  Color ="#66FFFFFF"  Offset ="0.325" />
                                     < GradientStop  Color ="#1EFFFFFF"  Offset ="0.325" />
                                 </ LinearGradientBrush >
                             </ Grid.Resources >
                             < VisualStateManager.VisualStateGroups >
                                 < VisualStateGroup  x:Name ="CommonStates" >
                                     < VisualStateGroup.Transitions >
                                         < VisualTransition  GeneratedDuration ="00:00:00.2000000"  To ="MouseOver" />
                                         < VisualTransition  GeneratedDuration ="0:0:0.1"  To ="Pressed" />
                                         < VisualTransition  GeneratedDuration ="00:00:00.2000000"  From ="Normal"  To ="MouseOver" />
                                     </ VisualStateGroup.Transitions >
                                     < VisualState  x:Name ="Normal" >
                                         < Storyboard />
                                     </ VisualState >
                                     < VisualState  x:Name ="MouseOver" >
                                         < Storyboard >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#c8d5ed"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#97c2ee"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#6eadee"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#aff9ff"   />
                                             </ ColorAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ VisualState >
                                     < VisualState  x:Name ="Pressed" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames  Duration ="0"  Storyboard.TargetName ="BackgroundGradient"  Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" >
                                                 < SplineDoubleKeyFrame  KeyTime ="0"  Value =".2" />
                                             </ DoubleAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#bac5e8"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#7bb2e9"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#4d9ae7"   />
                                             </ ColorAnimationUsingKeyFrames >
                                             < ColorAnimationUsingKeyFrames 
                                                 Duration ="0"  
                                                Storyboard.TargetName ="BackgroundGradient"  
                                                Storyboard.TargetProperty ="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" >
                                                 < SplineColorKeyFrame  KeyTime ="0"  Value ="#85eaff"   />
                                             </ ColorAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ VisualState >
                                     < VisualState  x:Name ="Disabled" >
                                         < Storyboard >
                                             < DoubleAnimationUsingKeyFrames  Duration ="0"  Storyboard.TargetName ="DisabledVisual"  Storyboard.TargetProperty ="Opacity" >
                                                 < SplineDoubleKeyFrame  KeyTime ="0"  Value ="1" />
                                             </ DoubleAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ VisualState >
                                 </ VisualStateGroup >
                                 < VisualStateGroup  x:Name ="FocusStates" >
                                     < VisualState  x:Name ="Focused" >
                                         < Storyboard >
                                             < ObjectAnimationUsingKeyFrames  Duration ="0"  Storyboard.TargetName ="FocusVisual"  Storyboard.TargetProperty ="Visibility" >
                                                 < DiscreteObjectKeyFrame  KeyTime ="0" >
                                                     < DiscreteObjectKeyFrame.Value >
                                                         < Visibility > Visible </ Visibility >
                                                     </ DiscreteObjectKeyFrame.Value >
                                                 </ DiscreteObjectKeyFrame >
                                             </ ObjectAnimationUsingKeyFrames >
                                         </ Storyboard >
                                     </ VisualState >
                                     < VisualState  x:Name ="Unfocused" >
                                         < Storyboard />
                                     </ VisualState >
                                 </ VisualStateGroup >
                             </ VisualStateManager.VisualStateGroups >
                             < Rectangle  x:Name ="Background"  Fill ="{TemplateBinding Background}"  RadiusX ="11"  RadiusY ="11" />
                             < Rectangle  x:Name ="BackgroundGradient"  Stroke ="{StaticResource BorderBrush}"  StrokeThickness ="1"  RadiusX ="11"  RadiusY ="11"  Margin ="-1,-1,-1,-1" >
                                 < Rectangle.Fill >
                                     < LinearGradientBrush  EndPoint ="0.7,1"  StartPoint ="0.7,0" >
                                         < GradientStop  Color ="{StaticResource LinearBevelLightStartColor}"  Offset ="0" />
                                         < GradientStop  Color ="{StaticResource LinearBevelLightEndColor}"  Offset ="0.326" />
                                         < GradientStop  Color ="{StaticResource LinearBevelDarkStartColor}"  Offset ="0.344" />
                                         < GradientStop  Color ="#FFFFFFFF"  Offset ="0.786" />
                                     </ LinearGradientBrush >
                                 </ Rectangle.Fill >
                             </ Rectangle >
                             < Grid  x:Name ="FocusVisual"  Visibility ="Collapsed" >
                                 < Rectangle  Margin ="-2,1,-2,-2"  Stroke ="{StaticResource AccentBrush}"  StrokeThickness ="1"  StrokeDashArray ="1.5 1.5"  RadiusX ="3"  RadiusY ="3"   />
                             </ Grid >
                             < ContentPresenter  Margin ="4,5,4,4"  Content ="{TemplateBinding Content}"  ContentTemplate ="{TemplateBinding ContentTemplate}"  HorizontalAlignment ="{TemplateBinding HorizontalContentAlignment}"  VerticalAlignment ="{TemplateBinding VerticalContentAlignment}"   />
                             < Rectangle  x:Name ="DisabledVisual"  IsHitTestVisible ="false"  Opacity ="0"  Fill ="{StaticResource DisabledBrush}"  RadiusX ="11"  RadiusY ="11"  Margin ="-1,-1,-1,-1" />
                         </ Grid >
                     </ ControlTemplate >
                 </ Setter.Value >
             </ Setter >
         </ Style >
     </ UserControl.Resources >

     < Grid  x:Name ="LayoutRoot"  Background ="White"   >
         < Button  Height ="35"  HorizontalAlignment ="Stretch"  Margin ="198,132,262,0"  Style ="{StaticResource MyButton}"  VerticalAlignment ="Top"  Content ="Button" />
     </ Grid >
</ UserControl >

over.