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

使用透视转换的图像

Silverlight 参考:三维效果(透视转换) -- MSN

尽管上图中显示了应用于一个简单图像的透视转换,但您可以将透视转换应用于 Button(假定这些控件可见)。

使用透视转换的另一个常见情形是相对于彼此对对象进行排列,以便创建三维效果,如下图中所示。

堆叠对象以创建三维效果

Silverlight 参考:三维效果(透视转换) -- MSN

除了创建静态的三维效果外,还可以对透视转换属性进行动画处理,以便创建移动的三维效果。

说明

透视转换与三维引擎不等效;但是,它们都可用于使得二维 Silverlight 内容就像是在三维平面上绘制的一样。

在三维平面上旋转对象

若要将某一属性转换应用于 PlaneProjection 定义转换在空间中呈现的方式。下面的示例显示了一个简单的情况。

 

 

代码
<StackPanel Margin="35" Background="Gray">
    
<StackPanel.Projection>
        
<PlaneProjection RotationX="-35" RotationY="-35" RotationZ="15"  />
    
</StackPanel.Projection>
    
<TextBlock Margin="10">Type Something Below</TextBlock>
    
<TextBox Margin="10"></TextBox>
    
<Button Margin="10" Content="Click" Width="100" />
</StackPanel>

 

 

在上例中,RotationX 属性如何围绕 x 轴旋转一个对象。

RotateX = "-35"


Silverlight 参考:三维效果(透视转换) -- MSN

在该图中,还要注意 y 轴和 z 轴是如何显示的。所有这三个轴相交的点称作旋转中心。

RotationY 属性围绕旋转中心的 y 轴旋转。

RotateY = "-35"


Silverlight 参考:三维效果(透视转换) -- MSN

RotationZ 属性围绕旋转中心的 z 轴(直接穿过对象平面的直线)旋转。

RotateZ = "-45"


Silverlight 参考:三维效果(透视转换) -- MSN

这些旋转属性可以指定负值,这会以反方向将对象旋转某一度数。此外,绝对数可以大于 360,这会使对象旋转的度数超过一个完整旋转(即 360 度)。在下面的示例中,您可以为 RotationZ 属性试验不同值,以便看看效果。

运行此示例

您可以通过使用 CenterOfRotationY,0 和 1 之间的值会将轴线设置在对象内的某个位置。值为 0 表示一个对象边缘,值为 1 表示对侧边缘。允许此范围外的值,并且将相应移动旋转中心。因为旋转中心的 z 轴绘制穿过对象的平面,所以,

CenterOfRotationY

CenterOfRotationY = "0.5"(默认值)

Silverlight 参考:三维效果(透视转换) -- MSN

CenterOfRotationY = "0.1"(上边缘)

Silverlight 参考:三维效果(透视转换) -- MSN

请注意在 RotationY 属性旋转对象的位置时,您会看到相似的行为。

CenterOfRotationX = "0.5"(默认值)

Silverlight 参考:三维效果(透视转换) -- MSN

CenterOfRotationX = "0.9"(右侧边缘)

Silverlight 参考:三维效果(透视转换) -- MSN

使用下面的滑块示例试验围绕旋转中心的不同位置旋转对象的结果。

 

定位对象

到此为止,您已学习了如何在空间中旋转对象。此外,您可以通过使用以下属性,相对于这些旋转的对象彼此的位置在空间中定位它们:

本地偏移量

动画处理为从 0 到 65 度。

 

全局偏移量

GlobalOffsetZ 属性相对于屏幕沿轴平移对象。也就是说,与本地偏移量属性不同,对象沿其移动的轴与应用于该对象的任何旋转无关。当您只是想沿着屏幕的 x、y 或 z 轴移动对象,而不担心应用于对象的旋转时,这些属性很有用。

 

Matrix3DProjection 和 Matrix3D

您可以将 PlaneProjection 用于简单的三维方案更容易。

 

 

 

相关文章:

  • 2021-04-12
  • 2021-08-05
  • 2021-06-25
  • 2022-12-23
  • 2022-02-23
  • 2022-12-23
猜你喜欢
  • 2021-07-01
  • 2022-01-11
  • 2022-01-21
  • 2021-12-10
  • 2021-08-24
  • 2022-01-16
  • 2022-01-06
相关资源
相似解决方案