Silverlight 图形的转换

这篇是以 Blend 设计工具上的功能按钮为线索来介绍几种Silverlight 图形的转换。转换一般不影响布局，通常是在动画处理或向元素应用添加临时效果时用。

变化中心点的定义

变化的中心点在Blend工具上有2个地方定义：

一个是可以通过鼠标点击就可以使用的9个常用位置，

如下图的

就是。我们可用鼠标来点击这9个点，对应设置这个元素的中心位置。

对应到Xaml 文件中，就是修改选择元素的 RenderTransformOrigin 属性。

UIElement.RenderTransformOrigin 属性用于获取或设置由 RenderTransform 声明中，任何可能导致转换的中心点，这个中心点是相对于元素的边界而言的。

设置的值类似： RenderTransformOrigin="0.5,1"，依次是水平原点因子，垂直原点因子。通常这两个值为 0 至 1 之间的值。

0 和 1 之间的值被解释为当前元素在每个 X 轴和 Y 轴上的范围的因子。例如，(0.5,0.5) 将使呈现转换位于元素中心，而 (1,1) 会将呈现转换置于元素的右下角。

默认值是一个坐标为 (0,0) 的 Point。即：

RenderTransformOrigin 也可以接受 0 和 1 以外的值，并且将导致更不寻常的转换效果。例如，如果将 RenderTransformOrigin 设为 (5,5)，然后应用 RotateTransform，则旋转点将位于元素自身边界之外。转换将沿圆心远在右下方的大圆旋转元素。原点可能位于其父元素的某处，并可能位于框架或视图之外。负点值与此类似，这将超出左上边界。

Blend 中另外一个设置中心点的位置如下：在这里我们可以更灵活的设置，而不是之前的9个固定的常用点。

平移 TranslateTransform

沿 X、Y 平移对象跟定义常用的9个中心点在同一界面，如下：

上图中，指定元素按照X轴移动10个像素，Y轴移动10个像素。这两个属性的默认值都是0。可以为正值，可以为负值，可以为非整数。比如下面设置就是可以的

上面图片中，当我们把“使用相对值”打上勾时，表示我们要在目前平移数据上再相对增加的值，这时候输入相对值后，需要点击应用才会起作用。

在输入数字框里面，我们使用滚轮，也可以自动增加或者减少数字。

这个变化可以用来做伪3D效果。比如下面的例子：

Xaml 文件

<TextBlock
  FontFamily="Verdana"
  FontSize="32"
  FontWeight="Bold" 
  Foreground="Black"
  Text="Translated Text">
  <TextBlock.RenderTransform>
    <TranslateTransform X="2" Y="2" />
  
  
  TextBlock.RenderTransform>
 
   TextBlock> <TextBlock FontFamily="Verdana" FontSize="32" FontWeight="Bold" Foreground="Coral" Text="Translated Text"/>