带有滑块绑定的 TranslateTransform 不起作用答案

【问题标题】：TranslateTransform with slider binding doesn't work带有滑块绑定的 TranslateTransform 不起作用
【发布时间】：2013-09-23 07:16:24
【问题描述】：

不明白为什么Translatetransform 绑定不起作用。我有 3 个滑块 - 一个用于缩放，2 个用于 x 和 y 转换（我在代码中将圆圈作为 Canvas 的子元素）。

我在下面使用 XAML：

<Window x:Class="Visualizer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" WindowState="Maximized" WindowStartupLocation="CenterScreen" ResizeMode="NoResize">
    <Canvas HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Name="MainCanvas" >
        <Canvas HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Name="OperatorsCanvas" >
            <ContentControl x:Name="OperatorsContent"/>
            <Canvas.LayoutTransform>
                <TransformGroup>
                    <ScaleTransform 
                    CenterX="0" 
                    CenterY="0"
                    ScaleX="{Binding ElementName=ScaleSlider,Path=Value}"
                    ScaleY="{Binding ElementName=ScaleSlider,Path=Value}"
                    />
                    <TranslateTransform X="{Binding ElementName=TranslateXSlider,Path=Value}" Y="{Binding ElementName=TranslateYSlider,Path=Value}" />
                </TransformGroup>
            </Canvas.LayoutTransform>
        </Canvas>
        <Slider Canvas.Right="5" Width="154" Canvas.Top="5" HorizontalAlignment="Right" Name="ScaleSlider" ToolTip="Determines the UI scale factor."
                    Value="1" Minimum="0.1" Maximum="4"/>
        <Slider Canvas.Bottom="0" Width="762"  HorizontalAlignment="Stretch" Name="TranslateXSlider" Value="0" Minimum="-20" Maximum="20"/>
        <Slider Canvas.Right="0" Canvas.Top="282" Width="423" RenderTransformOrigin="0.494,0.455" Height="16" Name="TranslateYSlider"  Value="0" Minimum="-20" Maximum="20" >
            <Slider.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform Angle="90"/>
                    <TranslateTransform/>
                </TransformGroup>
            </Slider.RenderTransform>
        </Slider>
    </Canvas>
</Window>

缩放有效，但变换无效。

【问题讨论】：

标签： c# wpf canvas slider

【解决方案1】：

LayoutTransform 中的翻译将被忽略，如 MSDN 上 LayoutTransform 文档中的备注部分所述。您必须将 LayoutTransform 替换为 RenderTransform 才能使其正常工作：

<Canvas ...>
    <Canvas.RenderTransform>
        <TransformGroup>
            <ScaleTransform
                ScaleX="{Binding ElementName=ScaleSlider,Path=Value}"
                ScaleY="{Binding ElementName=ScaleSlider,Path=Value}"/>
            <TranslateTransform
                X="{Binding ElementName=TranslateXSlider,Path=Value}"
                Y="{Binding ElementName=TranslateYSlider,Path=Value}"/>
        </TransformGroup>
    </Canvas.RenderTransform>
    ...
</Canvas>

另请注意，Slider 具有 Orientation 属性。因此，无需在此处应用转换。

【讨论】：