-1

我有一个包含形状（路径）的画布，我在布局变换中将角度与旋转变换绑定。

当鼠标悬停在形状上（由我的路径生成）时，我在画布上生成 MouseRightButtonUp，然后右键单击我使用布局变换旋转 90 度。

但它的行为类似于渲染变换，因为我绑定的 canvas.left 和 canvas.top 在鼠标右键单击形状旋转后不会更新/更改，而角度会改变。我的代码在这里：

<Canvas Name="OuterCanvas" Background="Green"  Height="700" Width="1000"  >
    <ItemsControl  AllowDrop="True"  x:Name="itemsCtrl" ItemsSource="{Binding ShapesCollection,Mode=TwoWay}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas ClipToBounds="True" IsItemsHost="True"  Height="700" Width="1000" Background="Transparent" x:Name="dragCanvas">
                    <i:Interaction.Triggers>                                          
                        <i:EventTrigger EventName="MouseRightButtonUp">
                            <ie:CallMethodAction MethodName="MouseRightButtonUpEventHandler" TargetObject="{Binding}" />
                        </i:EventTrigger>
                    </i:Interaction.Triggers>                                          
                </Canvas>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Path  x:Name="im" Canvas.Left="{Binding Path=Canvas_Left , Mode=TwoWay}"
                      Canvas.Top="{Binding Path=Canvas_Top , Mode=TwoWay}"
                      Fill="{Binding Fill}"  Stroke="{Binding Stroke}"
                      StrokeThickness="{Binding StrokeThickness}" 
                      Data="{Binding Path=Data,Mode=TwoWay}">                                       
                    <Path.LayoutTransform>
                        <RotateTransform Angle="{Binding Path=Angle , Mode=TwoWay}"/>
                    </Path.LayoutTransform>                                             
                </Path>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="ContentPresenter">
                <Setter Property="Canvas.Left" Value="{Binding Path=Canvas_Left , Mode=TwoWay}" />
                <Setter Property="Canvas.Top" Value="{Binding Path=Canvas_Top , Mode=TwoWay}" />
            </Style>
        </ItemsControl.ItemContainerStyle>
    </ItemsControl>
</Canvas>

在视图模型中调用的旋转方法是：

   public void MouseRightButtonUpEventHandler(object sender, MouseButtonEventArgs e)
    {
        e.Handled = true;
        ElementBeingDragged = e.Source as UIElement;
        if (ElementBeingDragged is System.Windows.Shapes.Path)
            if (ElementBeingDragged != null)
            {
                if (ElementBeingDragged.AllowDrop)
                {
                    var rotateTransform = ((System.Windows.Shapes.Path)ElementBeingDragged).LayoutTransform as RotateTransform;
                    if (rotateTransform == null)
                    {
                        (e.Source as FrameworkElement).LayoutTransform = new RotateTransform();                            
                    }
                    ((System.Windows.Shapes.Path)ElementBeingDragged).LayoutTransform = rotateTransform;
                    ((System.Windows.Shapes.Path)ElementBeingDragged).RenderTransformOrigin = new Point(0.5, 0.5);
                    rotateTransform.Angle += 90;
                }
                 ((System.Windows.Shapes.Path)ElementBeingDragged).UpdateLayout();//.LayoutUpdated();
                isDragInProgress = false;
                Mouse.Capture(null);
            }

    }

为什么 Canvas.Left 和 Canvas.Top 即使在改变角度改变形状的位置后也不会更新？（假设矩形A(x1,y1) B(x2,y2) , c(x3,y3) D(x4,y4)在旋转 90 度后必须是A(x2,y2) B(x3,y3) , c(x4,y4) D(x1,y1) 为什么我的模型中 Canvas.Left 和 Canvas.Top 永远不会更新？

   public class Shapes :ICloneable
    { private double angle;
        public double Angle
        {
            get { return angle; }//Updates on rotation
            set
            {
                angle = value;
                RaisePropertyChanged("Angle");
            }
        }
        public double canvas_Top { get; set; }
        public double Canvas_Top
        {
            get { return canvas_Top; }//Never updates on rotation
            set
            {
                canvas_Top = value;
                RaisePropertyChanged("Canvas_Top");
            }
        }
        private double canvas_Left;
        public double Canvas_Left
        {
            get { return canvas_Left; } //Never updates on rotation
            set
            {
                canvas_Left = value;
                RaisePropertyChanged("Canvas_Left");
            }
        }
    }

这种行为在 Rendertransform 中是预期的，但为什么在这种情况下 LayoutTransform 表现得像 Rendertransform 因为我使用了 LayOutTranform

4

1 回答 1

1

转换不会更改基础坐标或控件属性。可以将其想象为在计算新位置或值但不更改原始属性的基本属性上应用掩码。

例如：如果我有一个边长为 2 的正方形。然后我应用 2 的缩放变换。原始边长保持 = 2。变换将计算新的边长 4 并以 4 的大小显示正方形。如果我删除变换，正方形将是原始大小 2。与您的 90 度旋转示例进行比较，虽然您是正确的x1,y1 和 x2,y2 的渲染值会发生变化，而基础值不会发生变化。即在视觉上你会看到它们发生了变化，但变换是造成视觉变化的原因。

RenderTransform .vs 之间的区别 LayoutTransform主要发生在这些计算发生时（即我什么时候将我的正方形边乘以 2，或将我的矩形旋转 90 度）。两者都不会调整其他属性的来源。在这里寻找一个很好的解释。（我相信还有更多的差异；但这是我认为发生混乱的地方）

如果要实际调整变换的Canvas.Top或Canvas.Left属性，则需要将变换应​​用于这些值，然后使用变换计算的值设置属性。

于 2017-07-10T21:06:51.613 回答