WPF中Button的ControlTemplate的有关问题

WPF中Button的ControlTemplate的问题
现在有一个Button，为了在贴图后去掉默认的边框用了ControlTemplate,同时实现一个当鼠标划过时换图片的效果

 

XML code

<Window.Resources>        <Style x:Key="ss" TargetType="Image">            <Setter Property="Source" Value="/image/nav-button.png"/>            <Style.Triggers>                <Trigger Property="Image.IsMouseOver" Value="true">                    <Setter Property="Source" Value="/image/nav-button_hover.png"/>                </Trigger>            </Style.Triggers>        </Style>    </Window.Resources> <Button Content="用户查找" Height="23" HorizontalAlignment="Left" Margin="-161,32,0,0" Name="bt_Find" VerticalAlignment="Top" Width="95" Click="bt_Find_Click">            <Button.Template>                <ControlTemplate>                    <Grid>                         <Image Name="Image_Find" Style="{StaticResource ss}" />                        <TextBlock Text="     用户查找" FontSize="12" HorizontalAlignment="Center" VerticalAlignment="Center"/>                    </Grid>                </ControlTemplate>            </Button.Template>        </Button>

但是，这段代码的问题在于，如果把TextBlock放在Image下，文字将无法显示，如果放在Image上面，换图片的效果就没法实现了，请问大家，应该怎么办啊。。。谢谢各位。。。

[解决办法]
感觉是不是重叠了啊？
用stackpanel试试？
[解决办法]
写了一点代码，看看对你有没有帮助，我测试了下，只要鼠标移到按钮上，图片就能换，不论是在文字上，还是不在文字上。

C# code

 
    <!--按钮背景画刷--> 
    <LinearGradientBrush x:Key="buttonBackgroundBrush"> 
      <GradientStop Offset="0" Color="Beige"/> 
      <GradientStop Offset="1" Color="White"/> 
    </LinearGradientBrush>   
    
    <!--按钮模板定义--> 
    <ControlTemplate x:Key="TestButtonTemplate" TargetType="{x:Type Button}"> 
      <Border x:Name="border" BorderThickness="1" BorderBrush="Black"  
           Background="{StaticResource buttonBackgroundBrush}" 
           CornerRadius="10"> 
        <Grid> 
          <Image x:Name="image" Source="a.png"  
               HorizontalAlignment="Center" 
               VerticalAlignment="Center"  
               Stretch="Fill" Height="50" Width="50"/> 
          <Label Content="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Content}" 
               HorizontalAlignment="Center" 
               VerticalAlignment="Center"/> 
        </Grid> 
      </Border> 
      
      <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="true"> 
          <Setter TargetName="image" Property="Source" Value="b.png"/> 
        </Trigger> 
      </ControlTemplate.Triggers>  
 
    </ControlTemplate> 
    
    <!--按钮样式定义，实际只需要在Button的Style中引用这个就好--> 
    <Style x:Key="TestButtonStyle" TargetType="{x:Type Button}"> 
      <Setter Property="FontSize" Value="15"/> 
      <Setter Property="FontWeight" Value="bold"/> 
      <Setter Property="SnapsToDevicePixels" Value="true"/> 
      <Setter Property="Foreground" Value="Blue"/> 
      <Setter Property="Template" Value="{StaticResource TestButtonTemplate}"/> 
    </Style> 
 

查看更多 下一篇