WPF-内部图像中的外部图像和内部图像的按钮没有显示

Question

我想创建一个wpf按钮，它有三个位图， 1.正常图像 2.悬停图像 3.按下图像。

我使用了下面给出的代码。

WPF: IsPressed trigger of ControlTemplate not working

现在我需要有这样的位图按钮内都有图片和文字。

<Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="300"/> 
      <RowDefinition Height="300"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 
     <loc:ImageButton Margin="10" Width="150" Height="186" NormalImageSource="Images\tile.png" HoverImageSource="Images\tile_overlay_hovered.png" PushedImageSource="Images\tile_overlay_pressed.png"> 
      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="142"/> 
        <RowDefinition Height="44"/> 
       </Grid.RowDefinitions> 
       <Image Source="Images\InnerImage.png" Width="70" Stretch="Uniform" Height="70" Margin="40"/> 
       <TextBlock Text="Name" Grid.Row="2" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
      </Grid> 
     </loc:ImageButton> 


    </Grid> 

我的风格xaml。

<Style TargetType="{x:Type local:ImageButton}"> 
     <Setter Property="HorizontalAlignment" Value="Left"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid> 
         <Image Name="image" Source="{Binding NormalImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" /> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="Button.IsMouseOver" Value="True"> 
          <Setter TargetName="image" Property="Source" Value="{Binding HoverImageSource, RelativeSource={RelativeSource TemplatedParent}}"/> 
         </Trigger> 
         <Trigger Property="Button.IsPressed" Value="True"> 
          <Setter TargetName="image" Property="Source" Value="{Binding PushedImageSource, RelativeSource={RelativeSource TemplatedParent}}"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

不幸的是，我不能让内部图像和文本显示？任何类型的指针将不胜感激。我的方法有什么问题吗？

Answer 1

添加到按钮的内容只有在控制模板中包含contentpresenter时才会显示。我不知道你期望按钮的样子是什么，但是这个控制模板会在外部图像的右边显示你的网格。

<ControlTemplate TargetType="{x:Type Button}"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 
     <Image Name="image" Source="{Binding NormalImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" /> 
     <ContentPresenter Grid.Column="1"/> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="Button.IsMouseOver" Value="True"> 
      <Setter TargetName="image" Property="Source" Value="{Binding HoverImageSource, RelativeSource={RelativeSource TemplatedParent}}"/> 
     </Trigger> 
     <Trigger Property="Button.IsPressed" Value="True"> 
      <Setter TargetName="image" Property="Source" Value="{Binding PushedImageSource, RelativeSource={RelativeSource TemplatedParent}}"/> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate>