#770 –LayoutTransform和RenderTransform属性的区别(Difference Between LayoutTransform and RenderTransform)

翻译 2017年08月11日 15:22:09

原文地址:https://wpf.2000things.com/2013/03/06/770-the-difference-between-a-layouttransform-and-a-rendertransform/

当要对界面元素进行2D变换的时候,你可以使用选择LayoutTransform 属性或者RenderTransform属性。

 - LayoutTransform 属性 是在元素布局的过程中进行变换(布局完成之前)

 - RenderTransform 属性 是在元素布局完成之后进行变换(渲染显示之前)

你可以选择其中一个进行变换,或者同时应用两个也可以。

<StackPanel Orientation="Horizontal">
    <StackPanel Orientation="Vertical">
        <Label Content="LayoutTransform"/>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}"/>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}">
            <Button.LayoutTransform>
                <RotateTransform Angle="20"/>
            </Button.LayoutTransform>
        </Button>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}">
            <Button.LayoutTransform>
                <RotateTransform Angle="-20"/>
            </Button.LayoutTransform>
        </Button>
    </StackPanel>
    <StackPanel Orientation="Vertical">
        <Label Content="RenderTransform"/>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}"/>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}">
            <Button.RenderTransform>
                <RotateTransform Angle="20"/>
            </Button.RenderTransform>
        </Button>
        <Button Content="Push Me" Style="{StaticResource buttonStyle}">
            <Button.RenderTransform>
                <RotateTransform Angle="-20"/>
            </Button.RenderTransform>
        </Button>
    </StackPanel>
</StackPanel>

上面的代码中我们将6个按钮分成两列,第一列使用LayoutTransform 属性进行变换,第二列使用RenderTransform 属性进行变换。运行的结果如下图:

770-001

从图中可以发现,第一列是先进行变换,然后在将变换后的按钮进行布局计算,因此在StackPanel中,按钮会按照自己需要的控件排列。第二列是先布局,然再布局的结果是上对按钮进行变换,因此按钮所占的布局空间不会有变化,因此导致按钮有部分重叠。


*********************************

由于LayoutTransform 在布局计算之前进行变换计算,因此如果LayoutTransform 发生了更改,比如动画更改,就会重新引发容器进行布局计算,简单来说LayoutTransform 的每一次变化都需要进行一次重新布局,而RenderTransform却不会。RenderTransform计算是在布局计算完成之后进行,它不会因此重新布局。因此默认情况下,推荐使用RenderTransform进行变换,只有非常特殊的情况下才会使用LayoutTransform 

WPF: RenderTransform特效

WPF中的变形(RenderTransform)类是为了达到直接去改变某个Silverlight对象的形状(比如缩放、旋转一个元素)的目的而设计的,RenderTransform包含的变形属性成员就是...
  • huyu107
  • huyu107
  • 2016年05月16日 11:48
  • 931

StackPanel 实现从上往下+从右往左 排列+RenderTransform特效实例分析

StackPanel:将子元素排列到可沿水平或垂直放置的行。 参考资料: 1. StackPanel类 2. Silverlight学习笔记(九)——RenderTransform特效【五种...
  • beckham467
  • beckham467
  • 2014年03月31日 16:52
  • 3905

RenderTransformOrigin 的作用

 对象中心点用来定义所有RenderTransform变换中相对位置的的参考点,默认为图形的左上即(0,0),该属性值为相对值,即x和y方向的(0-1)分别指以本图形所在矩形(在Expression ...
  • dongzhiquan
  • dongzhiquan
  • 2009年11月17日 22:54
  • 8114

#770 –LayoutTransform和RenderTransform属性的区别(Difference Between LayoutTransform and RenderTransform)

原文地址:https://wpf.2000things.com/2013/03/06/770-the-difference-between-a-layouttransform-and-a-render...
  • Libby1984
  • Libby1984
  • 2017年08月11日 15:22
  • 238

WPF中呈现变形与布局变形的区别

引例 文章一开始,先给出下图所示的画面布局。   图1 画面布局设计图 画面被分割成4行4列16个单元格,在1行2列的位置放置一个TextBlock控件并将其背景色设置为淡蓝色。  对应的XAML代码...
  • tiana0
  • tiana0
  • 2014年09月08日 16:08
  • 1757

wpf旋转

Storyboard myStoryboard; Rectangle rect = new Rectangle(); rect.Width = ...
  • yinhai_98
  • yinhai_98
  • 2011年02月24日 16:34
  • 738

WP8.1动画与变换区别以及Storyboard->DoubleAnimationUsingKeyFrames,Renderform和Projection的区别

学WP8.1以来,动画和变化这两个东西一直困扰着我,对应的Storyboard,Renderform以及Projection究竟有何区别我 也不是很明白。不知道大家有没有这种困惑。 所以对于强迫症...
  • u010792238
  • u010792238
  • 2014年11月16日 16:54
  • 1590

网格计算的希望:商业应用

网格计算的希望:商业应用 设想一下: 一家票务公司要销售滚石乐队的告别演出门票,IT部门经理担心,开始网上售票后,公司的服务器和软件会不会不堪重负?但实际上该公司并没有增加数十个服务器和存储系统,有关...
  • leijungood
  • leijungood
  • 2004年01月16日 15:45
  • 1470

wpf RenderTransform

var storyboard = new Storyboard(); Storyboard.SetTarget(storyboard, grid); ...
  • w18767104183
  • w18767104183
  • 2013年04月09日 09:29
  • 2384
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:#770 –LayoutTransform和RenderTransform属性的区别(Difference Between LayoutTransform and RenderTransform)
举报原因:
原因补充:

(最多只允许输入30个字)