WPF Canvas.Left/Canvas.Top 在旋转时不是很正确的坐标，为什么？

Question

我有一个奇怪但很大的问题。
我试图让用户在 Canvas 上移动/旋转一些矩形。我的机制基于操纵 Canvas.Left/Canvas.Top 属性进行移动，以及 RenderTransform.Rotate 进行旋转。我只需要旋转 0/90/180/270 角度。

问题是放置在 0 角旋转坐标 0.0 处的矩形显示正常，但 0.0 角旋转 90 角的同一矩形显示 0.0 以外的其他坐标处的元素。如我所见，在旋转为 0 或 180 的情况下，坐标总是正确的，但在 90/270 的情况下则是错误的。
设置的坐标与用户看到的坐标之间的差异与高度和宽度之间的差异有关。

有没有人遇到过这种问题？

谢谢，
丹尼尔

编辑:

当然，这里有一些 xaml:

    <Canvas 
        Height="500" 
        Width="500"
        Background="Green"

        <Rectangle 
            Canvas.Left="0" 
            Canvas.Top="0"
            Height="50"
            Width="100"
            RenderTransformOrigin="0.5,0.5"
            Fill="Red"

            <Rectangle.RenderTransform>
                <RotateTransform 
                Angle="90"
                />
            </Rectangle.RenderTransform>
        </Rectangle>
        <Rectangle 
            Canvas.Left="0" 
            Canvas.Top="0"
            Height="50"
            Width="100"
            RenderTransformOrigin="0.5,0.5"
            Fill="RoyalBlue"

            <Rectangle.RenderTransform>
                <RotateTransform 
                Angle="0"
                />
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas> 
</Grid>

如您所见，蓝色矩形似乎正确放置 (0,0)，但红色矩形显示在不同的坐标处，即使它返回 stil 0,0。

我发现公式:

displayPointX = Canvas.Left + 高度/2 - 宽度/2

diaplayPointY = Canvas.Top + 高度/2 - 宽度/2

Answer 1

丹尼尔，每个人都告诉你的是对的。如果您有一个矩形，并且将原点设置为 0.5、0.5，这意味着“围绕该对象的质心旋转”，因此如果您旋转 90 或 270 度，它当然会与您看到的完全一样。

如果您希望矩形旋转 90 度并仍然位于左上角，则必须旋转 90，然后平移 X 和 Y 以使角与 0,0 匹配，或者您需要旋转大约一个不同的中心(如 0,0)，并且只在 X 中平移。

下面是一个例子:

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Canvas Height="500" Width="500" Background="Green">
        <Rectangle Canvas.Left="0" Canvas.Top="0" Height="50" Width="100" RenderTransformOrigin="0.5,0.5" Fill="Red">
            <Rectangle.RenderTransform>
              <TransformGroup>
                <RotateTransform Angle="90" />
                <TranslateTransform X="-25" Y="25" />
              </TransformGroup>
            </Rectangle.RenderTransform>
        </Rectangle>
        <Rectangle Canvas.Left="0" Canvas.Top="0" Height="50" Width="100" RenderTransformOrigin="0.5,0.5" Fill="RoyalBlue">
            <Rectangle.RenderTransform>
                <RotateTransform Angle="0" />
            </Rectangle.RenderTransform>
        </Rectangle>
    </Canvas> 
</Page>

也许最好解释一下你真正想用它做什么。你说 0 和 180 很棒，因为角与 0,0 匹配，这也很奇怪，但是你的形状被旋转了，我们不知道保持方向对你来说是否重要。