旋转图像以跟随鼠标位置 - WPF C#

本文关键字:WPF 位置 鼠标 图像 跟随 旋转 | 更新日期: 2023-09-27 18:32:44

我正在尝试使图像旋转以跟随鼠标位置,就像来自小行星的飞船一样,但要用鼠标位置而不是箭头键来控制......帮助将不胜感激!

旋转图像以跟随鼠标位置 - WPF C#

首先,您需要知道图像的位置。 然后,您可以通过MouseMove事件找到光标位置。 每次鼠标移动时都会调用此事件。 您可以使用 GetPosition 方法查找Point以获取XY坐标。

 private void Window_MouseMove(object sender, MouseEventArgs e)
    {
        Point point = e.GetPosition(null);           
    }

现在您已经获得了XY坐标,您可以使用勾股定理来查找图像与光标所在位置之间的距离。 现在要找到角度,您可以AngleOfImage = sin^-1(Y/total distance between your image and cursor)找到角度。

如果希望图像在渲染后移动,则需要使用 RenderTransform 属性。 由于您需要旋转图像,因此可以使用RotateTransform类来完成此操作。 由于您已计算角度并将其设置为等于一个属性,AngleOfImage ,您可以将该属性绑定到 RotateTransformAngle依赖项属性 所以你的 xaml 看起来像这样。

<Image>
        <Image.RenderTransform>
            <RotateTransform Angle="{Binding AngleOfImage}"/>
        </Image.RenderTransform>
    </Image>

MouseMove事件计算角度的实际工作代码

private void Window_MouseMove(object sender, MouseEventArgs e)
    {
        var somePoint = e.GetPosition(mainWindow);
        X = somePoint.X;
        Y = somePoint.Y;
        var newX = Abs(X - RectangleOriginX);
        var newY = Abs(Y - RectangleOriginY);
        var powX = Pow(newX, 2);
        var powY = Pow(newY, 2);
        var distance = Sqrt(powX + powY);
        var result = newX / distance;          
        Angle = Asin(result).ToDegrees();
    }

其中ToDegrees()只是将值转换为度的扩展方法。 RectangleOriginXRectangleOriginY是我从中得到的控制点

 private void mainWindow_Loaded(object sender, RoutedEventArgs e)
    {
        var origialPoint = rect.TransformToAncestor(mainWindow).Transform(new Point(0, 0));
        RectangleOriginX = origialPoint.X;
        RectangleOriginY = origialPoint.Y;
    }

也是我的工作xaml

 <Rectangle x:Name="rect" Width="100" Height="100" RenderTransformOrigin="0.5,0.5" Fill="Red">
            <Rectangle.RenderTransform>
                <RotateTransform Angle="{Binding Angle}"/>
            </Rectangle.RenderTransform>
        </Rectangle>

对不起,我的英语不好

尝试使用 System.Windows.Forms.Timer ,并在Timer_tick事件中调用一些Move(MouseEventArgs e)

像这样的东西

private void Move(MouseEventArgs e)
    {
     if(mainwindow has focus)
     {
       your_image.Position = NextPosition(e);
     }
    }

MouseEventArgs 的实例是类的字段,它在 MouseMove 事件中会发生变化。

在NextPosition中,您可以使用任何路径查找算法

如果我能正确理解你

你可以通过一些数学来做到这一点

  • 首先获取中心点
  • 获取鼠标位置
  • 使用Math.ASin()获取角度
  • 会是这样的Math.ASin(x / d);

x 将是鼠标位置 - 图像中心位置

d 将是图像中心和鼠标位置之间的距离,您可以通过勾股定理获得它

然后使用计时器来实现这一点。

我希望我的回答对您有所帮助。