• Silverlight 图形:变换


    您可以在 Silverlight 中使用二维 (2-D) Transform
    类来旋转、按比例缩放、扭曲和移动(平移)对象。下面的示例应用了可以旋转和扭曲一行文本的变换。

      XAML


    <StackPanel> 
     <TextBlock FontSize="28" Text="Hello"> 
      <TextBlock.RenderTransform> 
       <TransformGroup> 
        <RotateTransform Angle="45" /> 
        <SkewTransform CenterX="0" CenterY="0" AngleX="60"/> 
       </TransformGroup> 
      </TextBlock.RenderTransform> 
     </TextBlock> 
    </StackPanel> 
     


      什么是变换?


      Transform 定义如何将一个坐标空间中的点映射或变换到另一个坐标空间。此映射由变换 Matrix(一个三行三列的 Double
    值集合)来描述。








    Silverlight 图形:变换说明:
      Silverlight 使用行优先矩阵。矢量用行矢量(而不是列矢量)表示。

      下表显示了 Silverlight 矩阵的结构。
















      M11

      默认值:1.0

      M12

      默认值:0.0

      0.0
      M21

      默认值:0.0

      M22

      默认值:1.0

      0.0
      OffsetX

      默认值:0.0

      OffsetY

      默认值:0.0

      1.0

      通过处理矩阵值,您可以旋转、按比例缩放、扭曲和移动(平移)对象。例如,如果将第三行第一列中的值(OffsetX 值)更改为 100,则可以将某一对象沿
    x 轴移动 100 个单位。如果将第二行第二列中的值更改为 3,您可以将某一对象拉伸为其当前高度的三倍。如果同时更改两个值,则可将对象沿 x 轴移动 100
    个单位并将其高度拉伸为原来的 3 倍。由于 Silverlight 仅支持仿射变换,因此右列中的值始终为 0、0、1。


      尽管 Silverlight 使您能够直接处理矩阵值,但它还提供了许多 Transform
    类,您可以使用这些类来变换对象,而无需了解基础矩阵结构的配置方式。例如,利用 ScaleTransform 类,您可以通过设置对象的 ScaleX 和
    ScaleY 属性来按比例缩放对象,而不用处理变换矩阵。同样,利用 RotateTransform 类,您只需通过设置对象的 Angle
    属性即可旋转对象。


      变换类


      Silverlight 为常见变换操作提供了以下二维 Transform 类。
























      类  说明  Illustration
      RotateTransform  按指定的 Angle 旋转元素。Silverlight 图形:变换
      ScaleTransform  按指定的 ScaleX 和 ScaleY 量按比例缩放元素。Silverlight 图形:变换
      SkewTransform  按指定的 AngleX 和 AngleY 量扭曲元素。Silverlight 图形:变换
      TranslateTransform  按指定的 X 和 Y 量移动(平移)元素。Silverlight 图形:变换

      为了创建更复杂的变换,Silverlight 提供了如下两个类。













      类  说明
      TransformGroup  将多个 TransformGroup 对象组合为可以随后应用于变换属性的单一 Transform。
      MatrixTransform  创建其他 Transform 类未提供的自定义变换。在使用 MatrixTransform
    时,将直接处理矩阵。

      常见变换属性


      变换对象的一种方法是声明适当的 Transform 类型,并将其应用于对象的变换属性。不同类型的对象具有不同类型的变换属性。下表列出了若干常用的
    Silverlight 类型及其变换属性。
















      类型  变换属性
      Brush  Transform,RelativeTransform
      Geometry  Transform
      UIElement  RenderTransform

      变换和坐标系


      在变换对象时,您不仅仅是变换对象,您变换的是对象所在的坐标系。默认情况下,变换将以目标对象坐标系的原点 (0,0) 为中心进行。唯一的例外是
    TranslateTransform,该对象没有要设置的中心属性,因为不管以何处为中心,平移效果都相同。


      下面的示例使用 RotateTransform,围绕其默认中心 (0, 0) 将 Rectangle 元素(一种 UIElement)旋转 45
    度。


      XAML


    <Grid x:Name="LayoutRoot" Background="White"> 
     <Rectangle Width="50" Height="50" 
      Fill="RoyalBlue"> 
      <Rectangle.RenderTransform> 
       <RotateTransform Angle="45" /> 
      </Rectangle.RenderTransform> 
     </Rectangle> 
    </Grid> 
     


      下图显示了旋转的效果。


      围绕点 (0,0) 旋转 45 度的矩形元素


    Silverlight 图形:变换


      默认情况下,元素将围绕其左上角 (0, 0) 旋转。RotateTransform、ScaleTransform 和 SkewTransform
    类提供 CenterX 和 CenterY 属性,可以利用这些属性来指定变换的应用点。


      下一个示例也使用 RotateTransform 将 Rectangle 元素旋转 45 度;但是,这一次设置了 CenterX 和 CenterY
    属性,因此 RotateTransform 的中心为 (25, 25)。


      XAML


    <StackPanel> 
     <Rectangle Width="50" Height="50" Fill="RoyalBlue"> 
      <Rectangle.RenderTransform> 
       <RotateTransform Angle="45" CenterX="25" CenterY="25" /> 
      </Rectangle.RenderTransform> 
     </Rectangle> 
    </StackPanel> 
     


      围绕点 (25,25) 旋转 45 度的矩形元素


    Silverlight 图形:变换


      对变换进行动画处理


      可以对 Transform 对象进行动画处理。若要对 Transform 进行动画处理,请将类型兼容的动画应用于想要进行动画处理的属性。


      下面的示例将 Storyboard 和 DoubleAnimation 与 RotateTransform 一起使用,以便使 Rectangle
    旋转到位。


      XAML


    <StackPanel Margin="15"> 
     <StackPanel.Resources> 
      <Storyboard x:Name="myStoryboard"> 
       <DoubleAnimation 
        Storyboard.TargetName="myTransform" 
        Storyboard.TargetProperty="Angle" 
        From="0" To="360" Duration="0:0:5" 
        RepeatBehavior="Forever" /> 
      </Storyboard> 
     </StackPanel.Resources> 
     <Rectangle Width="50" Height="50" Fill="RoyalBlue" 
      MouseLeftButtonDown="StartAnimation"> 
      <Rectangle.RenderTransform> 
       <RotateTransform x:Name="myTransform" Angle="45" CenterX="25" CenterY="25" /> 
      </Rectangle.RenderTransform> 
     </Rectangle> 
    </StackPanel> 
     


      VB


    Private Sub StartAnimation(ByVal sender As Object, ByVal e As MouseEventArgs)
        myStoryboard.Begin()
    End Sub





      交互式变换


      可以使用代码访问和操作 Transform 对象。实现这个目标的一种方法是命名 Transform,然后使用代码访问。下面的示例演示每次单击
    Rectangle 时,如何增加应用于 Rectangle 的 ScaleTransform 的 ScaleX 和 ScaleY 属性值。


      XAML


    <StackPanel> 
     <Rectangle MouseLeftButtonDown="HandleMouseButtonDown" 
      Width="50" Height="50" Fill="RoyalBlue"> 
      <Rectangle.RenderTransform> 
     
       <!-- If you give the transform a name you can 
        Access it easily from code. --> 
       <ScaleTransform x:Name="myScaleTransform" /> 
      </Rectangle.RenderTransform> 
     </Rectangle> 
    </StackPanel> 
     


      VB


    Private Sub HandleMouseButtonDown(ByVal sender As Object, ByVal e As MouseButtonEventArgs) 
      ' Increase ScaleX and ScaleY by 25%. 
      myScaleTransform.ScaleX = (myScaleTransform.ScaleX * 1.25) 
      myScaleTransform.ScaleY = (myScaleTransform.ScaleY * 1.25) 
    End Sub 
     


      三维转换


      您可以使用"透视转换"来将三维效果应用于任何 Silverlight
    UIElement。例如,您可以制造这样一个假象,即对象朝向您或远离您进行旋转,如下图中所示。


      使用透视转换的图像


    Silverlight 图形:变换

  • 相关阅读:
    关于Unicode的小理解
    大数据高并发学习笔记(3)
    大数据高并发学习笔记(2)
    .net阻止XSS攻击方法
    VUE-百度地图添加覆盖物及信息窗口添加导航功能
    第34章:高级全局API钩取 : IE连接控制
    第2章:动态调试技术--OllyDbg
    第33章:隐藏进程-API代码修改技术(下)
    第33章:隐藏进程-API代码修改技术(中)
    第1章:基础知识
  • 原文地址:https://www.cnblogs.com/zziss/p/2771748.html
Copyright © 2020-2023  润新知