上一篇中說到四個變換類,都是比較簡單的,這裏要說到四個變換類,分別爲:
MatrixTransfrom 矩陣變換,一句標準矩陣表示的變換
TransformGroup 複合變換按照指定順序將多個變換複合爲一個變換
CompositeTransform 組合變換按照固定順序組合一系列變換
表示二維 x-y 平面使用 3x3 矩陣進行自定義變換,上一篇文章中的四個變換類都是基於此得到,MtrixTransForm類是通過矩陣算法運行得到相應的效果
矩陣中第三列的值是固定不變的!
原理:
原座標(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.
2
3 <MatrixTransform Matrix="M11 M12 M21 M22 OffsetX OffsetY"></MatrixTransform>
示例:
<!--<TextBlock x:Name="tb1" FontSize="72" HorizontalAlignment="Center" VerticalAlignment="Center" Text="變換文字示例" Foreground="Cyan"></TextBlock>-->
<TextBlock x:Name="tbShow" FontSize="72" VerticalAlignment="Center" HorizontalAlignment="Center" Text="變換文字示例" Foreground="Cyan">
<TextBlock.RenderTransform>
<MatrixTransform Matrix="0,1,2,1,2,2"></MatrixTransform>
</TextBlock.RenderTransform>
</TextBlock>
</Grid>
效果:
總結規律得到
m12 ——Y軸上傾斜
m21 ——X軸上傾斜
m22——Y軸縮放
offsetX ——X軸上的位移
offsetY ——Y軸上的位移
部分參考:http://www.cnblogs.com/crazypig/archive/2012/02/20/2359599.html
http://www.oschina.net/question/213217_49488
表示對變換效果的一種複合,在TransformGroup中可以包含其他的變換,當然也嵌套TransformGroup
代碼:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<TextBlock x:Name="tbShow" FontSize="72" VerticalAlignment="Center" HorizontalAlignment="Center" Text="變換文字示例" Foreground="Cyan">
<TextBlock.RenderTransform>
<TransformGroup>
<TranslateTransform X="-2" Y="3"></TranslateTransform>
<ScaleTransform ScaleX="0.8" ScaleY="0.9"></ScaleTransform>
<RotateTransform Angle="23"></RotateTransform>
<TransformGroup>
<MatrixTransform Matrix="1,0,1,1,0,1"></MatrixTransform>
</TransformGroup>
</TransformGroup>
</TextBlock.RenderTransform>
</TextBlock>
</Grid>
這裏需要注意的是我們在定義變換的順序,因爲每個變換都是基於上一個變換的基礎進行變換,效果:
是表示對變換的一種組合,並且具有順序性,所有的變換都是通過屬性進行設置的
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<TextBlock x:Name="tbShow" FontSize="72" VerticalAlignment="Center" HorizontalAlignment="Center" Text="變換文字示例" Foreground="Cyan">
<TextBlock.RenderTransform>
<CompositeTransform Rotation="23" TranslateX="-2" TranslateY="3" ScaleX="0.8" ScaleY="0.9" ></CompositeTransform>
</TextBlock.RenderTransform>
</TextBlock>
</Grid>
上面代碼中用到屬性的意思Rotation表示旋轉的角度,TranslateX表示在X軸平移的位置量,TranslateY表示在Y軸平移的位置量,ScaleX表示在X軸縮放的尺寸,ScaleY表示在Y軸縮放的尺寸;
TransformGroup 和CompositeTransfom異同:兩者可以設置相同的屬性得到相同的效果,在TransformGroup中我們可以使用 TransformGroup進行相同變換的多次使用,但是在CompositeTransfom中使用屬性是不允許的,還有就是在 TransformGroup我們可以使用自定義變換MatrixTransfrom,但是在組合變換CompositeTransfom中並沒有該屬性;兩者還需要注意的是順序性,不同的順序,實現的效果不同;