如何平滑地旋转 uwp 用户控件？

Question

我创建了一个包含一些文本框、图像等的用户控件。现在我想用鼠标旋转该用户控件。我已经成功旋转，但是在旋转过程中它倒转，我在哪里做错了？下面是我的 xaml 和代码：

<UserControl...
    <Grid x:Name="ContainerGrid"
    Width="300" Height="400" RenderTransformOrigin="0.5,0.5"
    ManipulationMode="TranslateX,TranslateY,Rotate"
    ManipulationStarted="Manipulator_OnManipulationStarted"
    ManipulationDelta="Manipulator_OnManipulationDelta">

    <Grid.RenderTransform>
    <RotateTransform x:Name="RotateGrid" Angle="0"/>
    </Grid.RenderTransform>

    <!-- some elements -->
    <Rectangle x:Name="RotateRectangle"
    IsHitTestVisible="False"
    Width="16" Height="16"
    Fill="Red"
    VerticalAlignment="Top"
    HorizontalAlignment="Right" />
</Grid>


private void Manipulator_OnManipulationStarted(object sender, ManipulationStartedRoutedEventArgs e)
{
    if (e.Position.X > ContainerGrid.Width - RotateRectangle.Width && 
    e.Position.Y < ContainerGrid.Height - RotateRectangle.Height)
    {
    _isRotating = true;
    lastPosition = e.Position;
    return;
    }

    _isRotating = false;
}


private void Manipulator_OnManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{ 
    if (_isRotating)
    {
    Point currentLocation = e.Position;
    double radians = Math.Atan2((currentLocation.Y - lastPosition.Y),     (currentLocation.X - lastPosition.X));
    var angle = radians * 180 / Math.PI;
    RotateGrid.Angle = angle;
    lastPosition = currentLocation;
    }
}

Answer 1

您的问题令人困惑...您想在屏幕平面上旋转 2D 对象，对吗？ （这就是我从你的转换中假设的。）那么你为什么同时使用 x 和 y 鼠标位置？您的旋转是一个标量值，因此您应该只使用鼠标移动的 1 轴。

如果您想通过让鼠标抓住对象周围的假想环并旋转它来旋转对象...那么您应该保持对相对于对象中心或起始角度的起始位置的引用鼠标相对于对象的中心。可能是这样的：

private void Manipulator_OnManipulationStarted(object sender, ManipulationStartedRoutedEventArgs e)
{
    if (e.Position.X > ContainerGrid.Width - RotateRectangle.Width && 
    e.Position.Y < ContainerGrid.Height - RotateRectangle.Height)
    {
    _isRotating = true;
    var startingRadians = Math.Atan2((currentLocation.Y - objectCenter.Y),     (currentLocation.X - objectCenter.X));
    startingAngle = startingRadians * 180 / Math.PI;
    return;
    }

    _isRotating = false;
}

private void Manipulator_OnManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{ 
    if (_isRotating)
    {
    Point currentLocation = e.Position;
    double radians = Math.Atan2((currentLocation.Y - objectCenter.Y),     (currentLocation.X - objectCenter.X));
    var angle = radians * 180 / Math.PI;
    RotateGrid.Angle = angle-startingAngle;
    }
}