如何通过鼠标悬停更改 TabItem 的标题图像？

Question

我有一个这样的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> 
  ...

在这个TabControl我有三个不同的 TabItem，每个选项卡项都有一个默认图像。 我的目标是更改用户放置鼠标的图像 TabItem。

因此，在这种情况下，当鼠标悬停在此选项卡项目上时，带有ToolTip “播放”而不是logo.png的 TabItem 1 应该具有logo2 。

我怎样才能做到这一点？

注意：请注意，我正在使用 mahapp，并且我正在使用DataTemplate来保留工具提示文本，而不会覆盖 mahapp 选项卡项的原始样式。

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" }
        };
    }
}