1:简单实用
<Button Height="143" HorizontalAlignment="Left" Margin="30,34,0,0" Name="button1" VerticalAlignment="Top" Width="145">
<Button.Background>
<ImageBrush ImageSource="图片路径" Stretch="Fill"/>
<Button.Background/>
</Button>
2:复杂绚丽
<Window x:Class="WpfApplication4.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Window.Resources>
<!--定义按钮样式-->
<Style x:Key="buttonTemplate" TargetType="Button" >
<!--修改模板属性-->
<Setter Property="Template">
<Setter.Value>
<!--控件模板-->
<ControlTemplate TargetType="Button">
<!--只有Grid才能装下这么多Child-->
<Grid>
<!--带特效的底层背景-->
<Border x:Name="back" Opacity="0.8" CornerRadius="2">
<Border.BitmapEffect>
<OuterGlowBitmapEffect Opacity="0.8" GlowSize="0" GlowColor="Red" />
</Border.BitmapEffect>
<Rectangle Width="49" Height="49">
<Rectangle.Fill>
Red
</Rectangle.Fill>
</Rectangle>
<!--按钮呈矩形-->
</Border>
<Rectangle x:Name="outerCircle" Width="50" Height="50">
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="0" Color="DarkOliveGreen"/>
<GradientStop Offset="1" Color="Azure"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<Rectangle Width="40" Height="40">
<Rectangle.Fill>
<ImageBrush Stretch="Fill" ImageSource="/WpfApplication4;component/Images/png-0095.png" />
</Rectangle.Fill>
</Rectangle>
<!--按钮内容-->
<Border>
<TextBlock x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Text="{TemplateBinding Content}">
</TextBlock>
</Border>
</Grid>
<!--触发器-->
<ControlTemplate.Triggers>
<Trigger Property="Button.IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="10" Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
<ColorAnimation To="#4FFF" BeginTime="0:0:0.2" Duration="0:0:0.2" Storyboard.TargetName="outerCircle" Storyboard.TargetProperty="(Ellipse.Fill).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
<ColorAnimation To="#3FFF" BeginTime="0:0:0.2" Duration="0:0:0.2" Storyboard.TargetName="outerCircle" Storyboard.TargetProperty="(Ellipse.Fill).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.2" Storyboard.TargetName="back" Storyboard.TargetProperty="(Border.BitmapEffect).(OuterGlowBitmapEffect.GlowSize)" />
<ColorAnimation Duration="0:0:0.2" Storyboard.TargetName="outerCircle" Storyboard.TargetProperty="(Ellipse.Fill).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)" />
<ColorAnimation Duration="0:0:0.2" Storyboard.TargetName="outerCircle" Storyboard.TargetProperty="(Ellipse.Fill).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)" />
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
<Trigger Property="Button.IsPressed" Value="True">
<Setter Property="RenderTransform">
<Setter.Value>
<ScaleTransform ScaleX=".9" ScaleY=".9"/>
</Setter.Value>
</Setter>
<Setter Property="RenderTransformOrigin" Value=".5,.5"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<Button Content="Button" Style="{StaticResource buttonTemplate}" Height="105" HorizontalAlignment="Left" Margin="153,108,0,0" Name="button1" VerticalAlignment="Top" Width="201">
</Button>
</Grid>
</Window>