RenderTransform特效：
變形（RenderTransform）類是為了達到直接去改變某個Silverlight對象的形狀（比如縮放、旋轉一個元素）的目的而設計的，RenderTransform包含的變形屬性成員就是專門用來改變Silverlight對象形狀的，它可以實現對元素拉伸，旋轉，扭曲等效果，同時變形特效也常用於輔助產生各種動畫效果，下面列出RenderTransform類的成員：
l TranslateTransform：能夠讓某對象的位置發生平移變化。
l RotateTransform：能夠讓某對象產生旋轉變化，根據中心點進行順時針旋轉或逆時針旋轉。
l ScaleTransform：能夠讓某對象產生縮放變化。
l SkewTransform：能夠讓某對象產生扭曲變化。
l TransformGroup：能夠讓某對象的縮放、旋轉、扭曲等變化效果合並起來使用。
l MatrixTransform：能夠讓某對象通過矩陣算法實現更為復雜的變形。
變形元素包括平移變形、旋轉變形、縮放變形、扭曲變形、矩陣變形和組合變形元素，變形特效常用於在不改變對象本身構成的情況下，使對象產生變形效果，所以變形元素常輔助產生Silverlight中的各種動畫效果。
TranslateTransform(平移變化)：包含X、Y 兩種屬性，以原來的對象為坐標原點(0,0),然后向X軸、Y軸進行平移變換。
1 <Canvas>
2 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg" Opacity="0.5"></Image>
3 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg">
4 <Image.RenderTransform>
5 <TranslateTransform X="120" Y="120"></TranslateTransform>
6 </Image.RenderTransform>
7 </Image>
8 </Canvas>
RotateTransform(旋轉變化):包括屬性Angle（旋轉角度），CenterX、CenterY（旋轉的中心）
1 <Canvas>
2 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg" Opacity="0.5"></Image>
3 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg">
4 <Image.RenderTransform>
5 <RotateTransform Angle="45" CenterX="0" CenterY="0"></RotateTransform>
6 </Image.RenderTransform>
7 </Image>
8 </Canvas>
ScaleTransform(縮放變化)：包括屬性ScaleX、ScaleY、CenterX、CenterY，其中ScaleX、ScaleY屬性表示對象在X、Y軸進行縮放的倍數，使用CenterX 和 CenterY屬性指定一個中心點。
1 <Canvas>
2 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg" Opacity="0.5"></Image>
3 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg">
4 <Image.RenderTransform>
5 <ScaleTransform ScaleX="0.5" ScaleY="0.5"></ScaleTransform>
6 </Image.RenderTransform>
7 </Image>
8 </Canvas>
SkewTransform(扭曲變化)：包括屬性AngleX、AngleY、CenterX、CenterY。其中使用AngleX讓元素相對X軸傾斜角度，AngleY是讓元素圍繞Y軸的傾斜角度。同樣CenterX和CenterY是中心點位置。
1 <Canvas>
2 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg" Opacity="0.5"></Image>
3 <Image Canvas.Top="160" Canvas.Left="140" Source="sun.jpg">
4 <Image.RenderTransform>
5 <SkewTransform AngleX="30" AngleY="10"></SkewTransform>
6 </Image.RenderTransform>
7 </Image>
8 </Canvas>
TransformGroup：縮放、旋轉、扭曲等變化效果合並起來。以上四種基本變化只是單一的變化，如果想要實現多種效果的疊加，那么就要使用到TransformGroup，否則會報錯。TransformGroup的作用類似於在控件布局中的StackPanel內嵌的作用，是把多種變化元素組合成一種變化的容器。
1 <Canvas Width="640" Height="480">
2 <Rectangle Canvas.Top="20" Canvas.Left="200" Width="400" Height="300" Stroke="Black" StrokeThickness="5">
3 <Rectangle.RenderTransform>
4 <TransformGroup>
5 <!--RotateTransform 變換-->
6 <RotateTransform Angle="10"></RotateTransform>
7 <!--SkewTransform變換-->
8 <SkewTransform AngleX="-10" AngleY="30" CenterX="20" CenterY="50"></SkewTransform>
9 </TransformGroup>
10 </Rectangle.RenderTransform>
11 <Rectangle.Fill>
12 <ImageBrush ImageSource="sun.jpg"></ImageBrush>
13 </Rectangle.Fill>
14 </Rectangle>
15 </Canvas>
-----------------------------------------------------MatrixTransform 矩陣變換------------------------------------------
MatrixTransform矩陣變換，其實就是其他變形類的底層實現的代碼，其他的類都是基於這個類的擴展，以讓用戶可以更加簡單方便的應用，至於MatrixTransform則是通過一種矩陣算法來進行運算得到相應的變形的效果的。矩陣的一些基本算法就不多總結了，以前上課就學過了，網上也有不少講解。
矩陣中第三列的值是固定不變的！
原理：
原坐標（x0，y0）通過這個3*3矩陣
得到變換之后的新坐標（x1，y1）的過程如下：
[x0,y0] *
，通過矩陣乘法可得到坐標 (x0 * M11+x0 * M21,y0 * M12+y0 * M22)之后，再加上 (OffsetX,OffsetY) 即可得到新坐標（x1，y1）。也即是說最終坐標 (x1,y1) : x1 = x0 * M11 + x0 * M21 + OffsetX , y1 = y0 * M12 + y0 * M22 + OffsetY.
1 <!--源碼用法-->
2
3 <MatrixTransform Matrix="M11 M12 M21 M22 OffsetX OffsetY"></MatrixTransform>
下面使用MatrixTransform矩陣變換實現以上五種基本的變換效果。
1 <Canvas Width="1200" Height="300">
2 <StackPanel Orientation="Horizontal" Canvas.Top="50">
3 <!-- TranslateTransform 平移 -->
4 <Image Source="Images/adobe_Ai.png" Height="100" Width="100" Stretch="Fill"
5 Margin="10" Opacity="0.5"></Image>
6 <Image Source="Images/adobe_Ai.png" Height="100" Width="100" Stretch="Fill"
7 Margin="10">
8 <Image.RenderTransform>
9 <MatrixTransform Matrix="1 0 0 1 -80 30"></MatrixTransform>
10 </Image.RenderTransform>
11 </Image>
12
13 <!-- RotateTransform 旋轉 -->
14 <Image Source="Images/adobe_Dw.png" Height="100" Width="100" Stretch="Fill"
15 Margin="10" Opacity="0.5"></Image>
16 <Image Source="Images/adobe_Dw.png" Height="100" Width="100" Stretch="Fill"
17 Margin="10">
18 <Image.RenderTransform>
19 <!-- 90°旋轉 -->
20 <MatrixTransform Matrix="0 1 -1 0 30 0"></MatrixTransform>
21 </Image.RenderTransform>
22 </Image>
23
24 <!-- ScaleTransform 縮放 -->
25 <Image Source="Images/adobe_Fl.png" Height="100" Width="100" Stretch="Fill"
26 Margin="10" Opacity="0.5"></Image>
27 <Image Source="Images/adobe_Fl.png" Height="100" Width="100" Stretch="Fill"
28 Margin="10">
29 <Image.RenderTransform>
30 <!--放大1.5倍-->
31 <MatrixTransform Matrix="1.5 0 0 1.5 -80 0"></MatrixTransform>
32 </Image.RenderTransform>
33 </Image>
34
35 <!-- SkewTransform 扭曲傾斜 -->
36 <Image Source="Images/adobe_Fw.png" Height="100" Width="100" Stretch="Fill"
37 Margin="10" Opacity="0.5"></Image>
38 <Image Source="Images/adobe_Fw.png" Height="100" Width="100" Stretch="Fill"
39 Margin="10">
40 <Image.RenderTransform>
41 <!-- x軸傾斜 -->
42 <MatrixTransform Matrix="1 0 1 1 -80 0"></MatrixTransform>
43 </Image.RenderTransform>
44 </Image>
45
46 <!-- TransformGroup 扭曲、縮放 -->
47 <Image Source="Images/adobe_Id.png" Height="100" Width="100" Stretch="Fill"
48 Margin="10" Opacity="0.5"></Image>
49 <Image Source="Images/adobe_Id.png" Height="100" Width="100" Stretch="Fill"
50 Margin="10">
51 <Image.RenderTransform>
52 <!-- x軸傾斜 -->
53 <!--放大1.5倍-->
54 <MatrixTransform Matrix="1.5 0 1 1.5 -120 0"></MatrixTransform>
55 </Image.RenderTransform>
56 </Image>
57 </StackPanel>
58 </Canvas>
