WPF:旋转矩形并将其放置在 Canvas 中

Question

我在旋转矩形并将其以某种方式放置在 Canvas 上时遇到问题。这是我试图实现的目标:

Rotated Rectangles http://www.freeimagehosting.net/uploads/79844652d2.jpg

图片中的大矩形是我的 Canvas 。较小的矩形是我要旋转的矩形。当我旋转矩形(虚线矩形)时，它当然会被剪裁。为避免这种情况，我想重新定位右侧图片中的矩形。

到目前为止，我是这样尝试的:

Rectangle rect = new Rectangle();
rect.Width = 100;
rect.Height = 50;
int angle = 30;
rect.RenderTransform = new RotateTransform(angle, rect.Width/2, rect.Height/2);
canvas.Children.Add(rect);

double x = Math.Cos(30) * (rect.Width / 2) + Math.Sin(30) * (rect.Height / 2) - rect.Width / 2;
double y = Math.Sin(30) * (-rect.Width / 2) + Math.Cos(30) * (rect.Height / 2) - rect.Height / 2;
Canvas.SetLeft(rect, x);
Canvas.SetTop(rect, y);

我认为最好的方法是计算 x 和 y 偏移并将矩形定位到 Canvas.SetLeft和 Canvas.SetTop .但是我在弄清楚如何进行数学运算时遇到了问题。 (y 计算似乎有效)。

实际上我想在 Canvas 上随机放置几个矩形。旋转角度可以是 -45 到 45 度之间的值，矩形大小也可以是随机值。但是矩形应该始终在 Canvas 中完全可见，所以我需要知道位置坐标边界的偏移量。 (矩形可能会相互重叠。)

我希望你能理解我的问题。如果你能帮助我，那就太好了。

Answer 1

解决方案实际上比您想象的要简单得多。而不是使用 RenderTransform , 使用 LayoutTransform反而。它采用相同类型的转换，但不是在渲染过程中将它们应用于元素的渲染输出，而是在布局过程中改变元素的布局空间。因此，以下 XAML 会生成您在屏幕截图的第二个示例中显示的结果。

<Canvas Width="640" Height="480">
    <Rectangle Fill="Blue" Width="200" Height="80">
        <Rectangle.LayoutTransform>
            <RotateTransform Angle="-45"/>
        </Rectangle.LayoutTransform>
    </Rectangle>
</Canvas>

请注意，这在 Silverlight 中不起作用，因为 Silverlight 不支持 LayoutTransform。