wpf - 如何让旋转变换和布局变换一起工作

Question

我有一个简单的 Canvas 如下:

<Canvas x:Name="canvBackground" Grid.Row="0" Margin="20" Background="Blue">
        <Canvas.LayoutTransform>
            <ScaleTransform x:Name="scaleTransformBackground"
                            ScaleX="{Binding Value,
                                             ElementName=uiSliderZoom}"
                            ScaleY="{Binding Value,
                                             ElementName=uiSliderZoom}" />
        </Canvas.LayoutTransform>
        <Canvas.RenderTransform>
            <RotateTransform x:Name="rotateTransformBackground"
                            Angle="{Binding Value,
                                             ElementName=uiSliderRotate}"></RotateTransform>
        </Canvas.RenderTransform  >
    </Canvas>

这些转换绑定(bind)到两个 slider 控件。我已经为 Canvas 的背景分配了一个画笔，效果很好。在我分配画笔时，我将两个变换的 centerX 和 centerY 属性设置为图像 X 和 Y 的一半。缩放 slider 和旋转 slider 一样按预期工作。

当我组合缩放和 slider 时，我得到了奇怪的结果(即旋转变换仍然基于原始尺寸图像的 centerX 和 centerY 属性。因此旋转和缩放没有按预期运行(放大到出并围绕图像的中心旋转。

有人可以帮忙吗？

非常感谢。

Answer 1

您可以将两个 Transform 放在一个 TransformGroup 中并将其分配给 LayoutTransform 或 RenderTransform:

<Canvas x:Name="canvBackground" Grid.Row="0" Margin="20" Background="Blue">
    <Canvas.RenderTransform>
        <TransformGroup>
            <ScaleTransform x:Name="scaleTransformBackground"
                            ScaleX="{Binding Value, ElementName=uiSliderZoom}"
                            ScaleY="{Binding Value, ElementName=uiSliderZoom}" />
            <RotateTransform x:Name="rotateTransformBackground"
                             Angle="{Binding Value, ElementName=uiSliderRotate}" />
        </TransformGroup>
    </Canvas.RenderTransform  >
</Canvas>

您可能还需要设置 RenderTransformOrigin .