WPF自定义Button样式(按钮长度随Content长度自适应)

代码如下：

  <Style x:Key="ButtonStyle" TargetType="Button">
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="Button">
                     <!--StackPanel是用来控制当Button长度变化时，位置的适应-->
                     <StackPanel x:Name="spPanel" Orientation="Horizontal" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" >
                         <Grid>
                             <Grid.Background>
                                 <ImageBrush Stretch="Fill" ImageSource="btn-n.png"/>
                             </Grid.Background>
                             <Grid.ColumnDefinitions>
                                 <ColumnDefinition></ColumnDefinition>
                                 <ColumnDefinition></ColumnDefinition>
                             </Grid.ColumnDefinitions>
                             <Border x:Name="logoImg" Width="60" Height="51">
                                 <Border.Background>
                                     <ImageBrush Stretch="None" ImageSource="btn-icon-up.png"/>
                                 </Border.Background>
                             </Border>
                             <!--Viewbox是控制当文字的长度超出最长限制时，对文字进行缩小处理-->
                             <Viewbox Grid.Column="1" MaxWidth="350">
                                 <Label x:Name="lblContent" Padding="0,0,5,0" VerticalContentAlignment="Center" Content="{TemplateBinding Content}"/>
                             </Viewbox>
                         </Grid>
                     </StackPanel>
                 </ControlTemplate>
             </Setter.Value>
         </Setter>
     </Style>

效果如下图：

当内容变长时：

使用到的知识：

1. StackPanel：用来控制Button的位置，可以设置居中，或左右对齐；

2. Viewbox：用来实现内容超长时，将文字缩小

**精简过并加上触发器的代码：

  <Style x:Key="ButtonStyle" TargetType="Button">
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="Button">
                     <!--StackPanel是用来控制当Button长度变化时，位置的适应-->
                     <StackPanel x:Name="spPanel" Orientation="Horizontal" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" >
                         <StackPanel.Background>
                             <ImageBrush Stretch="Fill" ImageSource="btn-n.png"/>
                         </StackPanel.Background>
                         <Border x:Name="logoImg" Width="53" Height="43" Margin="5,0,0,0">
                             <Border.Background>
                                 <ImageBrush Stretch="UniformToFill" ImageSource="btn-icon-up.png"/>
                             </Border.Background>
                         </Border>
                         <!--Viewbox是控制当文字的长度超出最长限制时，对文字进行缩小处理-->
                         <Viewbox Grid.Column="1" MaxWidth="350" Margin="5,0">
                             <Label x:Name="lblContent"  VerticalContentAlignment="Center" Content="{TemplateBinding Content}"/>
                         </Viewbox>
                         <!--</Grid>-->
                     </StackPanel>
                     <ControlTemplate.Triggers>
                         <Trigger Property="IsMouseOver" Value="true">
                             <Setter TargetName="spPanel" Property="Background">
                                 <Setter.Value>
                                     <ImageBrush Stretch="Fill"  ImageSource="btn-h.png"/>
                                 </Setter.Value>
                             </Setter>
                             <Setter TargetName="logoImg" Property="Background">
                                 <Setter.Value>
                                     <ImageBrush Stretch="UniformToFill" ImageSource="btn-icon-right.png"/>
                                 </Setter.Value>
                             </Setter>
                         </Trigger>
                     </ControlTemplate.Triggers>
                 </ControlTemplate>
             </Setter.Value>
         </Setter>
     </Style>