WPF快速指导14：变换
变换，也叫变形（transform）。它定义了从一个坐标空间到另一个坐标空间的映射。变换通过矩阵来描述。变换包括旋转、伸缩、倾斜、调动，这些行为都是矩阵变换。用户还可以实现自己的矩阵。
各种变换通过RenderTransform属性来应用。RenderTransform是UIElement的一个公共属性，它的类型是Transform。类型Transform是一个抽象类。所以，要为元素的设置变化，就意味着要为元素的RenderTransform属性设置一个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.RenderTransform >
< RotateTransform Angle ="45" ></ RotateTransform >
</ Rectangle.RenderTransform >
</ Rectangle >
如果要使用后台代码，则如下：
前：
<
Rectangle
x:Name
="Rect2"
Width
="200"
Height
="100"
Stroke
="Black"
>
</ Rectangle >
</ Rectangle >
后台：
Rect2.RenderTransform
=
new
RotateTransform() { Angle
=
30
};
默认的旋转点是矩形的左上角。为了更改旋转点，可以设置CenterX和CenterY。两个矩形的最终样式如下：
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 >
< 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 };
}
{
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;
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;
}
{
TransformGroup group = ((textBlock1.RenderTransform) as TransformGroup);
group.Children.Add( new TranslateTransform() { X = 50 , Y = 100 });
textBlock1.RenderTransform = group;
}
本文基于
Creative Commons Attribution 2.5 China Mainland License发布，欢迎转载，演绎或用于商业目的，但是必须保留本文的署名
http://www.cnblogs.com/luminji（包含链接）。如您有任何疑问或者授权方面的协商，请给我留言。
