<a href="http://webabcd.blog.51cto.com/1787395/342790" target="_blank">[索引頁]</a>
<a href="http://down.51cto.com/data/100302">[源碼下載下傳]</a>
穩紮穩打Silverlight(10) - 2.0其它之Transform詳解，以及UIElement和FrameworkElement的常用屬性
介紹
Silverlight 2.0 其它：
RenderTransform - 呈現位置的轉換（System.Windows.Media.Transform類型）
TranslateTransform - 平移轉換
RotateTransform - 旋轉轉換（順時針）
ScaleTransform - 縮放轉換
SkewTransform - 扭曲轉換
MatrixTransform - 仿射矩陣變換
TransformGroup - 多個 Transform 組成的複合轉換
RenderTransformOrigin - 位置轉換的中心點
Clip - 容器的剪輯區域（System.Windows.Media.Geometry類型）
IsHitTestVisible - 命中測試是否可見
Opacity - 不透明度。0 - 1之間
OpacityMask - 不透明蒙版（遮罩）（System.Windows.Media.Brush類型）
UseLayoutRounding - 是否使用完整像素布局
Cursor - 滑鼠移動到 FrameworkElement 上面時，滑鼠指針的樣式
Margin - 容器邊緣與邊緣之外的空白距離（像素值：上下左右；左右,上下；左,上,右,下）
Tag - 儲存一些額外的資訊（System.Object類型）
線上DEMO
<a href="http://webabcd.blog.51cto.com/1787395/342779">http://webabcd.blog.51cto.com/1787395/342779</a>
示例
1、Transform.xaml
<UserControl x:Class="Silverlight20.Other.Transform"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel HorizontalAlignment="Left">
<!--
RenderTransform - 呈現位置的轉換（System.Windows.Media.Transform類型）
RenderTransformOrigin - 位置轉換的中心點
-->
<Grid Margin="20">
<Rectangle Width="200" Height="100" StrokeDashArray="3,1" Stroke="Blue" StrokeThickness="3" />
<Rectangle Width="200" Height="100" Fill="Yellow" Stroke="Red" StrokeThickness="3" Opacity="0.3">
<Rectangle.RenderTransform>
<!--TranslateTransform - 平移轉換-->
<!--
X - 水準方向上移動的距離。預設值 0
Y - 垂直方向上移動的距離。預設值 0
-->
<TranslateTransform X="100" Y="10" />
</Rectangle.RenderTransform>
</Rectangle>
</Grid>
<!--RotateTransform - 旋轉轉換（順時針）-->
Angle - 旋轉角度。預設值 0
CenterX - 旋轉中心點的 X 軸坐标。預設值 0
CenterY - 旋轉中心點的 Y 軸坐标。預設值 0
<RotateTransform Angle="15" CenterX="100" CenterY="50" />
<!--
RenderTransformOrigin - 位置轉換的中心點
-->
<Rectangle Width="200" Height="100" Fill="Yellow" Stroke="Red" StrokeThickness="3" Opacity="0.3" RenderTransformOrigin="0.5,0.5">
<RotateTransform Angle="15" />
<!--ScaleTransform - 縮放轉換-->
ScaleX - X 軸方向上縮放的倍數。預設值 1
ScaleY - Y 軸方向上縮放的倍數。預設值 1
CenterX - 縮放中心點的 X 軸坐标。預設值 0
CenterY - 縮放中心點的 Y 軸坐标。預設值 0
<ScaleTransform ScaleX="1.1" ScaleY="1.3" CenterX="100" CenterY="50" />
<!--SkewTransform - 扭曲轉換（典型應用：在 二維 對象中模拟 三維 深度）-->
CenterX - 扭曲中心點的 X 軸坐标。預設值 0
CenterY - 扭曲中心點的 Y 軸坐标。預設值 0
AngleX - X 軸扭曲角度，Y 軸繞原點旋轉（逆時針）。CenterX 對此值所産生的呈現結果沒有影響。預設值 0
AngleY - Y 軸扭曲角度，X 軸繞原點旋轉（順時針）。CenterY 對此值所産生的呈現結果沒有影響。預設值 0
<SkewTransform AngleX="30" AngleY="5" CenterX="0" CenterY="0" />
<!--TransformGroup - 多個 Transform 組成的複合轉換-->
<TransformGroup>
<TranslateTransform X="100" Y="10" />
<RotateTransform Angle="15" CenterX="100" CenterY="50" />
</TransformGroup>
<!--MatrixTransform - 仿射矩陣變換-->
|X| |M11（預設值 1） M21（預設值 0） 0|
|Y| = |x y 1| * |M12（預設值 0） M22（預設值 1） 0|
|1| |OffsetX（預設值 0） OffsetY（預設值 0） 1|
X = x * M11 + y * M12 + OffsetX
Y = x * M21 + y * M22 + OffsetY
<MatrixTransform>
<MatrixTransform.Matrix >
<!--仿射矩陣中的 平移轉換-->
<!--
OffsetX - 水準位移
OffsetY - 垂直位移
-->
<Matrix OffsetX="100" OffsetY="10" />
</MatrixTransform.Matrix>
</MatrixTransform>
<!--仿射矩陣中的 縮放轉換-->
M11 - 水準放大倍數
M22 - 垂直放大倍數
<Matrix M11="1.1" M22="1.3" />
<!--仿射矩陣中的 扭曲轉換-->
M21 - X 軸扭曲角度，Y 軸繞原點旋轉（逆時針）。tanθ（本例中θ等于30度）
M12 - Y 軸扭曲角度，X 軸繞原點旋轉（順時針）。tanθ（本例中θ等于5度）
<Matrix M21="0.577350269189626" M12="0.087488663525924" />
<!--仿射矩陣中的 旋轉轉換-->
|cosθ sinθ 0|
|-sinθ cosθ 0|
|0 0 1|
注：本例中的θ角等于15度
<Matrix M11="0.965925826289068" M12="0.258819045102521" M21="-0.258819045102521" M22="0.965925826289068" />
</StackPanel>
</UserControl>
2、UIElement.xaml
<UserControl x:Class="Silverlight20.Other.UIElement"
<Rectangle Width="200" Height="100" Fill="Green" Stroke="Blue" StrokeThickness="3" />
<Rectangle Width="200" Height="100" Fill="Yellow" Stroke="Red" StrokeThickness="3">
<!--
Clip - 容器的剪輯區域（System.Windows.Media.Geometry類型）
-->
<Rectangle.Clip>
<EllipseGeometry Center="200,100" RadiusX="100" RadiusY="50" />
</Rectangle.Clip>
IsHitTestVisible - 命中測試是否可見。如果設定為False，則無法響應Click事件
<Button x:Name="btnTest" Width="200" Content="關閉了HitTest的按鈕" Click="btnTest_Click" IsHitTestVisible="False" />
Opacity - 不透明度。0 - 1之間
<Image Source="/Silverlight20;component/Images/Logo.jpg" Height="100" Opacity="0.3" />
<Image Source="/Silverlight20;component/Images/Logo.jpg" Height="100">
OpacityMask - 不透明蒙版（遮罩）（System.Windows.Media.Brush類型）
<Image.OpacityMask>
<RadialGradientBrush Center="0.5,0.5">
<GradientStop Color="#FF000000" Offset="0" />
<GradientStop Color="#44000000" Offset="0.8" />
<GradientStop Color="#00000000" Offset="1" />
</RadialGradientBrush>
</Image.OpacityMask>
</Image>
<StackPanel>
UseLayoutRounding - 是否使用完整像素布局。預設值為 true
舉例：如果設定了Margin="1.6"（非完整像素）
那麼UseLayoutRounding="true"時，則容器的外邊距不相等；UseLayoutRounding="false"時，則容器的外邊距相等
<Grid Width="20" Height="20" Margin="5" UseLayoutRounding="True">
<Border BorderBrush="#FF884909" Background="#FFFBECA3" BorderThickness="1"></Border>
<Border BorderBrush="#FF884909" Background="#FFFBECA3" BorderThickness="1" Margin="1.6"></Border>
</Grid>
<Grid Width="20" Height="20" Margin="5" UseLayoutRounding="False">
</StackPanel>
3、FrameworkElement.xaml
<UserControl x:Class="Silverlight20.Other.FrameworkElement"
<StackPanel HorizontalAlignment="Left" >
Cursor - 滑鼠移動到 FrameworkElement 上面時，滑鼠指針的樣式
Arrow - 箭頭
Hand - 手形
Wait - 沙漏
IBeam - “I”字形
Stylus - 點
Eraser - 橡皮
None - 無
Margin - 容器邊緣與邊緣之外的空白距離（像素值：上下左右；左右,上下；左,上,右,下）
Tag - 儲存一些額外的資訊（System.Object類型）
<Rectangle Width="200" Height="100" Fill="Red" Cursor="IBeam" Margin="5" Tag="1234" />
OK
<a href="http://down.51cto.com/data/100302" target="_blank">[源碼下載下傳]</a>
本文轉自webabcd 51CTO部落格，原文連結：http://blog.51cto.com/webabcd/343016，如需轉載請自行聯系原作者
![阿裡雲ECS（ubutun）下安裝docker[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)