2015-02-23 89 views
0

我想創建一個wpf按鈕,它有三個位圖, 1.正常圖像 2.懸停圖像 3.按下圖像。WPF-內部圖像中的外部圖像和內部圖像的按鈕沒有顯示

我使用了下面給出的代碼。

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> 

不幸的是,我不能讓內部圖像和文本顯示?任何類型的指針將不勝感激。我的方法有什麼問題嗎?

回答

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> 
+0

我已經用VisualStateManager解決了這個問題。 – Sukhas 2015-02-26 12:04:39

+0

然後你應該發佈你的解決方案 – ndonohoe 2015-02-26 13:45:59