MouseOver를 통해 TabItem의 머리글 이미지를 변경하는 방법은 무엇입니까?

Question

나는이 같은 TabControl을했습니다 :이 TabControl에서

<TabControl> 
<TabItem Header="playing" HorizontalAlignment="Left" Width="150" Tag="Tab1"> 
    <TabItem.HeaderTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Horizontal"> 
       <TextBlock Text="{Binding}" ToolTip="playing" /> 
        <Image Margin="10,0,0,0" Source="/logo.png" Height="25"/> 
      </StackPanel> 
     </DataTemplate> 
    </TabItem.HeaderTemplate> 
</TabItem> 
    ... 

나는 세 가지 다른 TabItem의를했습니다, 각 탭 항목은 기본 이미지가 있습니다. 내 목표는 사용자가 마우스를 배치 한 이미지 TabItem을 변경하는 것입니다.

logo.png 대신 ToolTip "재생 중"인 TabItem 1은이 탭 항목 위에 마우스가있을 때 logo2이되어야합니다.

어떻게하면됩니까?

참고 : mahapp를 사용하고 있으며 원래 스타일의 mahapp 탭 항목을 덮어 쓰지 않고 툴팁 텍스트를 유지하려면 DataTemplate을 사용하고 있습니다.

Answer 1

이 시도 :

XAML :

<Controls:MetroWindow 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls" 
        xmlns:local="clr-namespace:MahApps.Metro.Application21" 
        x:Class="MahApps.Metro.Application21.MainWindow" 
        BorderThickness="1" 
        BorderBrush="{DynamicResource AccentColorBrush}" 
        Icon="mahapps.metro.logo2.png" 
        Title="MainWindow" 
        Height="350" 
        Width="525"> 
<Controls:MetroWindow.Resources> 

    <DataTemplate x:Key="DataTemplate1"> 
     <StackPanel x:Name="Panel1" Orientation="Horizontal"> 
      <TextBlock Text="{Binding Text}" ToolTip="{Binding Text}" /> 
      <Image x:Name="Image1" Source="{Binding Logo}" Margin="10,0,0,0" Height="25"/> 
     </StackPanel> 
     <DataTemplate.Triggers> 
      <Trigger SourceName="Panel1" Property="IsMouseOver" Value="true" > 
       <Setter TargetName="Image1" Property="Source" Value="logo4.png" /> 
      </Trigger> 
     </DataTemplate.Triggers> 
    </DataTemplate> 

</Controls:MetroWindow.Resources> 

<Controls:MetroWindow.DataContext> 
    <local:MyViewModel/> 
</Controls:MetroWindow.DataContext> 

<Grid> 
    <TabControl ItemsSource="{Binding Data}" ItemTemplate="{StaticResource DataTemplate1}"> 
    </TabControl> 
</Grid> 

뷰 모델 :

public class MyViewModel 
{ 
    public ObservableCollection<MyData> Data { get; set; } 

    public MyViewModel() 
    { 
     Data = new ObservableCollection<MyData> 
     { 
      new MyData {Logo = "logo1.png", Text = "playing 1" }, 
      new MyData {Logo = "logo2.png", Text = "playing 2" }, 
      new MyData {Logo = "logo3.png", Text = "playing 3" } 
     }; 
    } 
}