WPF viewbox 子元素变换结果

Question

WPF开发过程中， 有如下层次结构的元素
<Canvas x:Name="pCanvas">
<Viewbox x:Name="Viewbox">
   <Grid>
      <Canvas x:Name="Canvas" Background="Transparent">
         <TextBlock Text="Test1" Background="Gray" Canvas.Top="170" Canvas.Left="50" />
         <TextBlock Text="Test2" Background="Gray" Canvas.Top="225" Canvas.Left="80" />
         <TextBlock Text="Test3" Background="Gray" Canvas.Top="170" Canvas.Left="150" />
      </Canvas>
   </Grid>
</Viewbox>
</Canvas>
请问，在于ViewBox进行移动、放大、缩小、旋转之后
如果将 Name="Canvas" 中的三个TextBlock 按变换之后的
呈现结果一个一个剪切到Name="pCanvas" 的Canvas 中？
现在遇到的问题是剪切出外层的Canvas时
三个TextBlock跟未进行移动、放大、缩小、旋转之前的情况一样， 没变化

Answer 1

你好 KeJun,

ViewBox一般是自适应的去做这些东西的，所以你的转换Canvas具体是什么？就是在设计界面里面放大或者缩小了UI么？

如果是这样，请你检查一下你的TextBox在转换之后的属性。我这边一个简单的测试表示这个属性在你缩放了以后是没有变的，既然代码没变那你拷贝过去也不会变：

我的测试代码：

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="474.5" Width="697.5">
    <Viewbox>
        <Grid Height="100" Width="100">
            <Canvas Background="Blue">
                <TextBlock Text="Test1" Background="Gray" Canvas.Top="15" Canvas.Left="15"/>
                <TextBlock Text="Test2" Background="Gray" Canvas.Top="45" Canvas.Left="15"/>
            </Canvas>
        </Grid>
        <!--<StackPanel>
            <Button HorizontalAlignment="Center">1111111</Button>
            <Button HorizontalAlignment="Center">2222222</Button>
            <Button HorizontalAlignment="Center">3333333</Button>
            <Button HorizontalAlignment="Center">4444444</Button>
            <TextBox>7788</TextBox>
            <Button >5555555</Button>
            <Ellipse Width="20" Height="20" Fill="Blue"></Ellipse>            
        </StackPanel>-->


    </Viewbox>
</Window>

所以我建议你还是Check你的UI代码里面的xaml，这个才是能变换的重点。

Answer 2

具体的应用场景是这样的  

1、首先在一个空白的Canvas里面  绘制两个图形（本例为两个箭头)，如下图：

<Canvas>
     <path>......</path>
     <path>......</path>
</Canvas>

2、然后通过鼠标选中两个箭头图形，并将它们放到一个ViewBox里面，如下图所示

<Canvas>
     <ViewBox>
         <Canvas>
                <Path>......</Path>
                <Path>......</Path>
         </Canvas>
     </ViewBox>
</Canvas>

Answer 3

//接上一个回复

3、通过控制点，对ViewBox进行缩放、移动、旋转 ，如下图：

4、操作完成之后，我要恢复到如下结构（即将刚刚加入的ViewBox去掉），将Path放回到原本的Canvas。

<Canvas>
     <path>......</path>
     <path>......</path>
</Canvas>

具体过程就是这样的， 现在就是在第四步的时候无法将path的尺寸、角度、位置的值转换过来...  让它显示成变换之后的效果（即上图中去掉红色区域及控制点。

期待您的解决思路  谢谢