Silverlight 苹果风格按钮Mac OS Style 实现的更新版

在 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 > 引用:http://msdn.microsoft.com/zh-cn/library/dd391775.aspx

你可能感兴趣的:(style,成功,苹果,正式版,关键点)