wpf style入门 - - - 很酷的实现

我学习和使用的style

http://geekswithblogs.net/cskardon/archive/2008/06/20/roundedbutton-button-style-wpf.aspx

其他

http://www.wiredprairie.us/journal/2006/09/wpf_decorators_build_your_own.html

http://msdn.microsoft.com/zh-cn/library/ms771597.aspx

http://msdn.microsoft.com/zh-cn/library/system.windows.controls.controltemplate.aspx

我的最终代码(XAML) <UserControl.Resources> <Style x:Key="ButtonFocusVisual"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Border> <Rectangle SnapsToDevicePixels="true" Margin="4" Stroke="Black" StrokeDashArray="1 2" StrokeThickness="1"/> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="RoundedButton" TargetType="{x:Type Button}"> <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/> <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> <Setter Property="BorderThickness" Value="3"/> <Setter Property="HorizontalContentAlignment" Value="Center"/> <Setter Property="VerticalContentAlignment" Value="Center"/> <Setter Property="Padding" Value="0,0,1,1"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <ControlTemplate.Resources> <Storyboard x:Key="ShowShine"> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Shine" Storyboard.TargetProperty="(UIElement.Opacity)"> <SplineDoubleKeyFrame KeyTime="00:00:00.5000000" Value="1"/> </DoubleAnimationUsingKeyFrames> </Storyboard> <Storyboard x:Key="HideShine"> <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Shine" Storyboard.TargetProperty="(UIElement.Opacity)"> <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </ControlTemplate.Resources> <Border CornerRadius="5,5,5,5" BorderThickness="0" RenderTransformOrigin="0.5,0.5" x:Name="border" BorderBrush="#FFFFFFFF"> <Border.RenderTransform> <TransformGroup> <ScaleTransform ScaleX=".9" ScaleY=".9"/> <SkewTransform AngleX="0" AngleY="0"/> <RotateTransform Angle="0"/> <TranslateTransform X="0" Y="0"/> </TransformGroup> </Border.RenderTransform> <Border Background="{TemplateBinding Background}" CornerRadius="5,5,5,5" x:Name="border1"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="0.5*"/> <RowDefinition Height="0.5*"/> </Grid.RowDefinitions> <Border Grid.Row="0" CornerRadius="5,5,0,0"> <Border.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#00FFFFFF" Offset="0"/> <GradientStop Color="#7EFFFFFF" Offset="1"/> </LinearGradientBrush> </Border.Background> </Border> <Border Grid.Row="1" Opacity="0" x:Name="Shine" Width="Auto" Height="Auto" CornerRadius="0,0,5,5" Margin="1,0,-1,0" Background="{TemplateBinding BorderBrush}"/> <ContentPresenter VerticalAlignment="Center" Grid.RowSpan="2" HorizontalAlignment="Center" x:Name="contentPresenter"/> </Grid> </Border> </Border> <ControlTemplate.Triggers> <Trigger Property="IsEnabled" Value="False"> <Setter Property="Foreground" Value="Gray"></Setter> <Setter Property="Opacity" TargetName="border1" Value="0.9"/> <Setter Property="Opacity" TargetName="border" Value="1"/> <Setter Property="Opacity" TargetName="contentPresenter" Value="0.9"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter Property="RenderTransform" TargetName="border"> <Setter.Value> <TransformGroup> <ScaleTransform ScaleX="0.8" ScaleY="0.8"/> <SkewTransform AngleX="0" AngleY="0"/> <RotateTransform Angle="0"/> <TranslateTransform X="0" Y="0"/> </TransformGroup> </Setter.Value> </Setter> </Trigger> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Foreground" Value="blue"></Setter> <Trigger.ExitActions> <BeginStoryboard Storyboard="{StaticResource HideShine}" x:Name="HideShine_BeginStoryboard"/> </Trigger.ExitActions> <Trigger.EnterActions> <BeginStoryboard x:Name="ShowShine_BeginStoryboard" Storyboard="{StaticResource ShowShine}"/> </Trigger.EnterActions> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources> <Grid> <Button Name="btn" Style="{DynamicResource RoundedButton}" Background="Transparent" Height="30" Focusable="False"> <Grid> <Image Name="img" Source="..\background.png" /> <TextBlock Text="Button" VerticalAlignment="Center" HorizontalAlignment="Center" TextBlock.FontWeight="Bold"></TextBlock> </Grid> </Button> </Grid>