WPF快速指导14:变换-阿里云开发者社区

开发者社区> 开发与运维> 正文

WPF快速指导14:变换

简介: WPF快速指导14:变换 变换,也叫变形(transform)。它定义了从一个坐标空间到另一个坐标空间的映射。变换通过矩阵来描述。变换包括旋转、伸缩、倾斜、调动,这些行为都是矩阵变换。用户还可以实现自己的矩阵。
WPF快速指导14:变换

变换,也叫变形(transform)。它定义了从一个坐标空间到另一个坐标空间的映射。变换通过矩阵来描述。变换包括旋转、伸缩、倾斜、调动,这些行为都是矩阵变换。用户还可以实现自己的矩阵。
各种变换通过RenderTransform属性来应用。RenderTransform是UIElement的一个公共属性,它的类型是Transform。类型Transform是一个抽象类。所以,要为元素的设置变化,就意味着要为元素的RenderTransform属性设置一个Transform的子类的一个实例对象。这话听上去有些拗口,但是下面的示例可以让大家明确这一点。

1:变换之RotateTransform
RotateTransform 就是抽象类Transform的一个子类,它负责在二维 x-y 坐标系内围绕指定点顺时针旋转对象。如,对一个rectangle转换角度45‘,前台代码如下:

<Rectangle x:Name="Rect1" Width="200" Height="100" Stroke="Black" StrokeThickness="5" RadiusX="50" RadiusY="5">
<Rectangle.RenderTransform>
<RotateTransform Angle="45"></RotateTransform>
</Rectangle.RenderTransform>
</Rectangle>

如果要使用后台代码,则如下:

前:  


<Rectangle x:Name="Rect2" Width="200" Height="100" Stroke="Black">
</Rectangle>

后台:


Rect2.RenderTransform = new RotateTransform() { Angle = 30 };

默认的旋转点是矩形的左上角。为了更改旋转点,可以设置CenterX和CenterY。两个矩形的最终样式如下:

img_b4caf24807f373e975c4bf3949b96c17.png

2:变换之ScaleTransform

ScaleTransform也是抽象类Transform的一个子类,它负责在二维 x-y 坐标系内缩放对象。
如,要对一个TextBlock宽度增大1.5,高度缩小0.5,应该像下面这样编码:
前台:

<TextBlock x:Name="textBlock1" Background="Blue" Width="100" Height="50">abc</TextBlock>
后台:

textBlock1.RenderTransform = new ScaleTransform() { ScaleX = 1.5, ScaleY = 0.5 };

3:变化之TranslateTransform
TranslateTransform也是抽象类Transform的一个子类,它负责在二维 x-y 坐标系内平移(移动)对象。
前台:

<TextBlock x:Name="textBlock1" Background="Blue" Width="100" Height="50">abc</TextBlock>
<Button x:Name="buttonTest" Click="buttonTest_Click" Canvas.Top="250">测试</Button>
后台:

private void buttonTest_Click(object sender, RoutedEventArgs e)
{
textBlock1.RenderTransform
= new TranslateTransform() { X = 50, Y = 100 };
}
点击后,物体平移。

4:变化之SkewTransform
SkewTransform也是抽象类Transform的一个子类,它负责表示二维扭曲,可用于在二维对象中创建三维深度幻觉。
代码:

textBlock1.RenderTransform = new SkewTransform() { AngleX = 30, AngleY = 20, CenterX = 50, CenterY = 80 };

5:变化之MatrixTransform
所有的变换,最根本的就是MatrixTransform。也就是以上几种变换,都可以通过MatrixTransform来解决。这需要一些图形的矩阵变换的知识,在这里不做深入讨论。

6:变换合并
如果尝试将以上的变换合并起来,即,假设你进行这样的操作:第一步将textBlock1设置为倾斜45°角,第二步将其平移50,则发现,倾斜角度没有了。如果要合并这样的操作,需要用到TransformGroup。
假设控件的初始状态如下:

TransformGroup group = new TransformGroup();
group.Children.Add(
new SkewTransform() { AngleX = 30, AngleY = 20, CenterX = 50, CenterY = 80 });
textBlock1.RenderTransform
= group;
要移动的代码如下:

private void buttonTest_Click(object sender, RoutedEventArgs e)
{
TransformGroup group
= ((textBlock1.RenderTransform) as TransformGroup);
group.Children.Add(
new TranslateTransform() { X = 50, Y = 100 });
textBlock1.RenderTransform
= group;
}


Creative Commons License本文基于Creative Commons Attribution 2.5 China Mainland License发布,欢迎转载,演绎或用于商业目的,但是必须保留本文的署名http://www.cnblogs.com/luminji(包含链接)。如您有任何疑问或者授权方面的协商,请给我留言。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章