WPF Button样式模板

  
    

   
      1 
   
      
   
     <!--
   
     按钮样式
   
     -->
   
     

   
      2 
   
      
   
     <
   
     Style TargetType
   
     =
   
     "
   
     Button
   
     "
   
     >
   
     

   
      3 
   
      
   
     <
   
     Setter Property
   
     =
   
     "
   
     Foreground
   
     "
   
      Value
   
     =
   
     "
   
     Black
   
     "
   
     />
   
     

   
      4 
   
      
   
     <!--
   
     修改模板属性
   
     -->
   
     

   
      5 
   
      
   
     <
   
     Setter Property
   
     =
   
     "
   
     Template
   
     "
   
     >
   
     

   
      6 
   
      
   
     <
   
     Setter.Value
   
     >
   
     

   
      7 
   
      
   
     <!--
   
     控件模板
   
     -->
   
     

   
      8 
   
      
   
     <
   
     ControlTemplate TargetType
   
     =
   
     "
   
     Button
   
     "
   
     >
   
     

   
      9 
   
      
   
     <!--
   
     背景色
   
     -->
   
     

   
      10 
   
      
   
     <
   
     Border x:Name
   
     =
   
     "
   
     back
   
     "
   
      Opacity
   
     =
   
     "
   
     0.8
   
     "
   
      CornerRadius
   
     =
   
     "
   
     3
   
     "
   
     >
   
     

   
      11 
   
      
   
     <
   
     Border.BitmapEffect
   
     >
   
     

   
      12 
   
      
   
     <
   
     OuterGlowBitmapEffect Opacity
   
     =
   
     "
   
     0.7
   
     "
   
      GlowSize
   
     =
   
     "
   
     0
   
     "
   
      GlowColor
   
     =
   
     "
   
     {Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}
   
     "
   
      
   
     />
   
     

   
      13 
   
      
   
     </
   
     Border.BitmapEffect
   
     >
   
     

   
      14 
   
      
   
     <
   
     Border.Background
   
     >
   
     

   
      15 
   
      
   
     <
   
     LinearGradientBrush StartPoint
   
     =
   
     "
   
     0,0
   
     "
   
      EndPoint
   
     =
   
     "
   
     0,1.5
   
     "
   
     >
   
     

   
      16 
   
      
   
     <
   
     GradientBrush.GradientStops
   
     >
   
     

   
      17 
   
      
   
     <
   
     GradientStopCollection
   
     >
   
     

   
      18 
   
      
   
     <
   
     GradientStop Color
   
     =
   
     "
   
     {Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}
   
     "
   
      Offset
   
     =
   
     "
   
     0
   
     "
   
     />
   
     

   
      19 
   
      
   
     <
   
     GradientStop Color
   
     =
   
     "
   
     {Binding RelativeSource={RelativeSource TemplatedParent}, Path=(Button.Background).(SolidColorBrush.Color)}
   
     "
   
      Offset
   
     =
   
     "
   
     0.4
   
     "
   
     />
   
     

   
      20 
   
      
   
     <
   
     GradientStop Color
   
     =
   
     "
   
     #FFF
   
     "
   
      Offset
   
     =
   
     "
   
     1
   
     "
   
     />
   
     

   
      21 
   
      
   
     </
   
     GradientStopCollection
   
     >
   
     

   
      22 
   
      
   
     </
   
     GradientBrush.GradientStops
   
     >
   
     

   
      23 
   
      
   
     </
   
     LinearGradientBrush
   
     >
   
     

   
      24 
   
      
   
     </
   
     Border.Background
   
     >
   
     

   
      25 
   
      
   
     <!--
   
     前景色及边框
   
     -->
   
     

   
      26 
   
      
   
     <
   
     Border x:Name
   
     =
   
     "
   
     fore
   
     "
   
      BorderThickness
   
     =
   
     "
   
     1
   
     "
   
      CornerRadius
   
     =
   
     "
   
     3
   
     "
   
      BorderBrush
   
     =
   
     "
   
     #5555
   
     "
   
     >
   
     

   
      27 
   
      
   
     <
   
     Border.Background
   
     >
   
     

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

   
      29 
   
      
   
     <
   
     GradientBrush.GradientStops
   
     >
   
     

   
      30 
   
      
   
     <
   
     GradientStopCollection
   
     >
   
     

   
      31 
   
      
   
     <
   
     GradientStop Color
   
     =
   
     "
   
     #6FFF
   
     "
   
      Offset
   
     =
   
     "
   
     0.5
   
     "
   
     />
   
     

   
      32 
   
      
   
     <
   
     GradientStop Color
   
     =
   
     "
   
     #1111
   
     "
   
      Offset
   
     =
   
     "
   
     0.51
   
     "
   
     />
   
     

   
      33 
   
      
   
     </
   
     GradientStopCollection
   
     >
   
     

   
      34 
   
      
   
     </
   
     GradientBrush.GradientStops
   
     >
   
     

   
      35 
   
      
   
     </
   
     LinearGradientBrush
   
     >
   
     

   
      36 
   
      
   
     </
   
     Border.Background
   
     >
   
     

   
      37 
   
      
   
     <!--
   
     按钮内容
   
     -->
   
     

   
      38 
   
      
   
     <
   
     ContentPresenter x:Name
   
     =
   
     "
   
     content
   
     "
   
      HorizontalAlignment
   
     =
   
     "
   
     Center
   
     "
   
      VerticalAlignment
   
     =
   
     "
   
     Center
   
     "
   
      Content
   
     =
   
     "
   
     {TemplateBinding Content}
   
     "
   
     >
   
     

   
      39 
   
      
   
     <
   
     ContentPresenter.BitmapEffect
   
     >
   
     

   
      40 
   
      
   
     <
   
     DropShadowBitmapEffect Color
   
     =
   
     "
   
     #000
   
     "
   
      Direction
   
     =
   
     "
   
     -90
   
     "
   
      ShadowDepth
   
     =
   
     "
   
     2
   
     "
   
      Softness
   
     =
   
     "
   
     0.1
   
     "
   
      Opacity
   
     =
   
     "
   
     0.3
   
     "
   
      
   
     />
   
     

   
      41 
   
      
   
     </
   
     ContentPresenter.BitmapEffect
   
     >
   
     

   
      42 
   
      
   
     </
   
     ContentPresenter
   
     >
   
     

   
      43 
   
      
   
     </
   
     Border
   
     >
   
     

   
      44 
   
      
   
     </
   
     Border
   
     >
   
     

   
      45 
   
      
   
     <!--
   
     触发器
   
     -->
   
     

   
      46 
   
      
   
     <
   
     ControlTemplate.Triggers
   
     >
   
     

   
      47 
   
      
   
     <!--
   
     鼠标移入移出
   
     -->
   
     

   
      48 
   
      
   
     <
   
     Trigger Property
   
     =
   
     "
   
     IsMouseOver
   
     "
   
      Value
   
     =
   
     "
   
     True
   
     "
   
     >
   
     

   
      49 
   
      
   
     <
   
     Trigger.EnterActions
   
     >
   
     

   
      50 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
      51 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
      52 
   
      
   
     <
   
     DoubleAnimation To
   
     =
   
     "
   
     6
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
      53 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #AFFF
   
     "
   
      BeginTime
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      54 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #3FFF
   
     "
   
      BeginTime
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      55 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
      56 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
      57 
   
      
   
     </
   
     Trigger.EnterActions
   
     >
   
     

   
      58 
   
      
   
     <
   
     Trigger.ExitActions
   
     >
   
     

   
      59 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
      60 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
      61 
   
      
   
     <
   
     DoubleAnimation Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
      62 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      63 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.2
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      64 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
      65 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
      66 
   
      
   
     </
   
     Trigger.ExitActions
   
     >
   
     

   
      67 
   
      
   
     </
   
     Trigger
   
     >
   
     

   
      68 
   
      
   
     <!--
   
     按钮按下弹起
   
     -->
   
     

   
      69 
   
      
   
     <
   
     Trigger Property
   
     =
   
     "
   
     IsPressed
   
     "
   
      Value
   
     =
   
     "
   
     True
   
     "
   
     >
   
     

   
      70 
   
      
   
     <
   
     Trigger.EnterActions
   
     >
   
     

   
      71 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
      72 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
      73 
   
      
   
     <
   
     DoubleAnimation To
   
     =
   
     "
   
     3
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
      74 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #3AAA
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      75 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #2111
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      76 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
      77 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
      78 
   
      
   
     </
   
     Trigger.EnterActions
   
     >
   
     

   
      79 
   
      
   
     <
   
     Trigger.ExitActions
   
     >
   
     

   
      80 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
      81 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
      82 
   
      
   
     <
   
     DoubleAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
      83 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      84 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
      85 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
      86 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
      87 
   
      
   
     </
   
     Trigger.ExitActions
   
     >
   
     

   
      88 
   
      
   
     </
   
     Trigger
   
     >
   
     

   
      89 
   
      
   
     <!--
   
     按钮失效
   
     -->
   
     

   
      90 
   
      
   
     <
   
     Trigger Property
   
     =
   
     "
   
     IsEnabled
   
     "
   
      Value
   
     =
   
     "
   
     False
   
     "
   
     >
   
     

   
      91 
   
      
   
     <
   
     Setter Property
   
     =
   
     "
   
     Foreground
   
     "
   
      Value
   
     =
   
     "
   
     #B444
   
     "
   
     />
   
     

   
      92 
   
      
   
     <
   
     Trigger.EnterActions
   
     >
   
     

   
      93 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
      94 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
      95 
   
      
   
     <
   
     DoubleAnimation To
   
     =
   
     "
   
     0
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.3
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
      96 
   
      
   
     <
   
     DoubleAnimation To
   
     =
   
     "
   
     1
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)
   
     "
   
      
   
     />
   
     

   
      97 
   
      
   
     <
   
     DoubleAnimation To
   
     =
   
     "
   
     -135
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)
   
     "
   
      
   
     />
   
     

   
      98 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #FFF
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.3
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)
   
     "
   
      
   
     />
   
     

   
      99 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #D555
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.3
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BorderBrush).(SolidColorBrush.Color)
   
     "
   
      
   
     />
   
     

   
     100 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #CEEE
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.3
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
     101 
   
      
   
     <
   
     ColorAnimation To
   
     =
   
     "
   
     #CDDD
   
     "
   
      Duration
   
     =
   
     "
   
     0:0:0.3
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
     102 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
     103 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
     104 
   
      
   
     </
   
     Trigger.EnterActions
   
     >
   
     

   
     105 
   
      
   
     <
   
     Trigger.ExitActions
   
     >
   
     

   
     106 
   
      
   
     <
   
     BeginStoryboard
   
     >
   
     

   
     107 
   
      
   
     <
   
     Storyboard
   
     >
   
     

   
     108 
   
      
   
     <
   
     DoubleAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     back
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)
   
     "
   
      
   
     />
   
     

   
     109 
   
      
   
     <
   
     DoubleAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Opacity)
   
     "
   
      
   
     />
   
     

   
     110 
   
      
   
     <
   
     DoubleAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Direction)
   
     "
   
      
   
     />
   
     

   
     111 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     content
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (ContentPresenter.BitmapEffect).(DropShadowBitmapEffect.Color)
   
     "
   
      
   
     />
   
     

   
     112 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.BorderBrush).(SolidColorBrush.Color)
   
     "
   
      
   
     />
   
     

   
     113 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
     114 
   
      
   
     <
   
     ColorAnimation Duration
   
     =
   
     "
   
     0:0:0.1
   
     "
   
      Storyboard.TargetName
   
     =
   
     "
   
     fore
   
     "
   
      Storyboard.TargetProperty
   
     =
   
     "
   
     (Border.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)
   
     "
   
      
   
     />
   
     

   
     115 
   
      
   
     </
   
     Storyboard
   
     >
   
     

   
     116 
   
      
   
     </
   
     BeginStoryboard
   
     >
   
     

   
     117 
   
      
   
     </
   
     Trigger.ExitActions
   
     >
   
     

   
     118 
   
      
   
     </
   
     Trigger
   
     >
   
     

   
     119 
   
      
   
     </
   
     ControlTemplate.Triggers
   
     >
   
     

   
     120 
   
      
   
     </
   
     ControlTemplate
   
     >
   
     

   
     121 
   
      
   
     </
   
     Setter.Value
   
     >
   
     

   
     122 
   
      
   
     </
   
     Setter
   
     >
   
     

   
     123 
   
      
   
     </
   
     Style
   
     >