c# - 鼠标悬停在 MVVM 单个对象上的事件

Question

我想知道解决我遇到的问题的最佳方法。
我正处于开发 WPF 应用程序的早期阶段，该应用程序具有多个图像
个别类(class)。我正在尝试使用 MVVM 模型，但我希望实现鼠标悬停事件，这样当我滚动图像时，我希望显示一些信息或对图像做一些效果我不太确定如何解决这个问题但是我有一个下面这个类的例子。

public class TeamKit
{
    private Image mainImage;
    public Canvas Position { get; set; }
    public TextBlock PlayerText { get; set; }
    public TextBlock NameText{ get; set; }
    public Player Player { get; set; }
    private string _playerName = "Player0";
    private string _playerNumber = "0";
    private BitmapImage _bImage;

    public TeamKit(Thickness t)
    {
        mainImage = new Image();
        _bImage = new BitmapImage(new Uri("pack://Application:,,,/Resources/KitC.png"));
        mainImage.Source = _bImage;
        mainImage.Stretch = System.Windows.Media.Stretch.None;
        Position = new Canvas();
        Position.Width = 38;
        Position.Height = 45;
        Position.Margin = t;
        mainImage.Margin = new Thickness(0, 0, 0, 6);

        PlayerText = new TextBlock();
        PlayerText.Text = ""; PlayerText.TextAlignment = TextAlignment.Center;
        PlayerText.Margin = new Thickness(11, 15, 27, 15);

        Position.Children.Add(mainImage);
        Position.Children.Add(PlayerText);
    }

    public TeamKit()
    {
        mainImage = new Image();
        _bImage = new BitmapImage(new Uri("pack://Application:,,,/Resources/KitC.png"));
        mainImage.Source = _bImage;
        mainImage.Stretch = System.Windows.Media.Stretch.None;
        Position = new Canvas();
        Position.Width = 38;
        Position.Height = 45;
        //mainImage.Margin = new Thickness(0, 0, 0, 6);

        PlayerText = new TextBlock();
        PlayerText.Text = _playerNumber; PlayerText.TextAlignment = TextAlignment.Center;
        PlayerText.Margin = new Thickness(12, 15, 27, 15);
        PlayerText.Width = 15;

        Viewbox Vb = new Viewbox();
        //Vb.StretchDirection = StretchDirection.Both;
        Vb.Stretch = System.Windows.Media.Stretch.Uniform;
        Vb.VerticalAlignment = VerticalAlignment.Stretch;
        Canvas.SetTop(Vb, 40);
        Canvas.SetLeft(Vb, -11);
        Vb.MaxWidth = 50;

        NameText = new TextBlock();
        NameText.Text = _playerName;
        NameText.TextAlignment = TextAlignment.Center;
        NameText.MaxHeight = 40;
        NameText.MaxWidth = 90;

        Vb.Child = NameText;
        Position.Children.Add(Vb);
         //<TextBlock Text="FooAlanghi" TextWrapping="Wrap" TextAlignment="Center" MaxHeight="40" MaxWidth="92" />


        Position.Children.Add(mainImage);
        Position.Children.Add(PlayerText);
    }

    public TeamKit(Player Player, int PlayerNumber)
    {
        this.Player = Player;
        _playerNumber = PlayerNumber.ToString();
        _playerName = Player.Last_Name;

        mainImage = new Image();
        _bImage = new BitmapImage(new Uri("pack://Application:,,,/Resources/KitC.png"));
        mainImage.Source = _bImage;
        mainImage.Stretch = System.Windows.Media.Stretch.None;
        Position = new Canvas();
        Position.Width = 38;
        Position.Height = 45;
        //mainImage.Margin = new Thickness(0, 0, 0, 6);

        PlayerText = new TextBlock();
        PlayerText.Text = _playerNumber; PlayerText.TextAlignment = TextAlignment.Center;
        PlayerText.Margin = new Thickness(12, 15, 27, 15);
        PlayerText.Width = 15;

        Viewbox Vb = new Viewbox();
        //Vb.StretchDirection = StretchDirection.Both;
        Vb.Stretch = System.Windows.Media.Stretch.Uniform;
        Vb.VerticalAlignment = VerticalAlignment.Stretch;
        Canvas.SetTop(Vb, 40);
        Canvas.SetLeft(Vb, -11);
        Vb.MaxWidth = 50;

        NameText = new TextBlock();
        NameText.Text = _playerName;
        NameText.TextAlignment = TextAlignment.Center;
        NameText.MaxHeight = 40;
        NameText.MaxWidth = 90;

        Vb.Child = NameText;
        Position.Children.Add(Vb);
        //<TextBlock Text="FooAlanghi" TextWrapping="Wrap" TextAlignment="Center" MaxHeight="40" MaxWidth="92" />


        Position.Children.Add(mainImage);
        Position.Children.Add(PlayerText);
    }


    public void Add(Panel Parent)
    {
        Parent.Children.Add(this.Position);
    }

    public static void DrawPositionLineUp(List<TeamKit> Players, Panel panel, double top, double left)
    {
        double ix = 0;
        foreach (TeamKit t in Players)
        {
            Canvas.SetLeft(t.Position, left);
            Canvas.SetTop(t.Position, ix += top);
            t.Add(panel);
        }
    }
}

Answer 1

很高兴您使用 MVVM 路线，但请注意，您想要做的与 MVVM 无关。你的问题都是与 View 相关的(嗯，主要是)。

你的控制需要一个 ToolTip :

<Image ...>
    <Image.ToolTip>
        <ToolTip ...>
            Content (which can be another layout of controls)
        </ToolTip>
    </Image.ToolTip>
</Image>

至于效果，取决于什么效果，其中很多已经内置(模糊，阴影等)。但是，无论哪种方式，您都想在样式中使用触发器。

<Image ...>
    <Image.Style>
        <Style>
            <Trigger Property="Image.IsMouseOver" Value="True">
                <Setter ... /> <!-- Apply Styles Here -->
            </Trigger>
        </Style>
    </Image.Style>
</Image>

注意:最好将样式提取到静态资源中，并将其应用于该窗口/用户控件/页面中的所有此类控件或链(应用程序)中更高级别的控件，以便您可以执行...

<Image Style="{StaticResource MouseOverImage}" ... />

至于为什么我说“你的问题都是与 View 相关的(嗯，主要是)”......我的意思是直到数据绑定(bind)点它都是与 View 相关的，那么你必须与你的 View 模型协调以确保它公开您需要的属性。除此之外，这是一个 100% 与 View 相关的问题，在这种情况下您不必担心任何 MVVM。继续使用 MVVM，但要意识到无论您是否使用 MVVM，您都会这样做。