wpf - WPF - 如果光标位于图像中的某个位置，则触发事件

Question

如果光标位于 WPF 中图像的某个部分，我试图触发一个事件。我想我可能会尝试在图像上“绘制”一个矩形并使用 mousein/out 事件。我目前不知道如何做到这一点。
因此，例如，如果光标进入图像的红色矩形，我想触发工具提示。

目前我<Image></Image>在 WPF 中使用标签，但似乎没有成功....

任何帮助表示赞赏！

标签： wpfimagebitmapdatatrigger

Answer 1

我可能会利用，这MouseEventArgs.GetPosition给了我相对于我作为参数移交的对象的位置。此外，我会尝试使用图像的缩放，以便这种方法对以后更改图像大小具有鲁棒性。这种方法仍然会在您的代码中为您提供一堆幻数，但我认为这是无法避免的。

这是一个快速示例，展示了我的意思。

最后结果

这是一个展示该方法结果的 gif，请注意

是的，这是一只猫头鹰

出现，当我们超过图像的某个部分时。

主窗口.xaml

<Window x:Class="MousePosition.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:MousePosition"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Grid ShowGridLines="True" MouseMove="MousePosition">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="100"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="100"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="100"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="100"/>
    </Grid.RowDefinitions>

    <TextBlock Grid.Column="1" x:Name="Feedback"/>
    <Image x:Name="PrettyOwl" Grid.Column="1" Grid.Row="1" Source="Images/10-dithering-opt.jpg"/>
    <TextBlock Grid.Column="1" Grid.Row="2" x:Name="WeAreThere"/>
</Grid>

主窗口.xaml.cs

using System.Windows;
using System.Windows.Input;

namespace MousePosition
{
    /// <summary>
    /// Interaktionslogik für MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void MousePosition(object sender, MouseEventArgs e)
        {
            var scale = PrettyOwl.ActualWidth / PrettyOwl.Source.Width;

            Point p = e.GetPosition(PrettyOwl);

            Feedback.Text = string.Format("GetPosition(Mouse): X = {0}, Y = {1}", p.X, p.Y);

            if (p.X > 100*scale && p.X < 200*scale && p.Y > 100*scale && p.Y < 200*scale)
            {
                WeAreThere.Text = "Yup, this is an owl";
            }

            e.Handled = true;
        }
    }
}

希望有帮助！