3D-ish旋转

即使计算机屏幕是平面和二维的，也可以在这些屏幕上绘制视觉对象，使其具有第三维的外观。 在本章的前面，您看到了一些文本效果，它们提供了第三个维度的提示，而Xamarin.Forms支持两个额外的旋转，名为RotationX和RotationY，它们似乎也突破了屏幕固有的二维平面度。
处理3D图形时，将屏幕视为3D坐标系统的一部分很方便。 像往常一样，X轴是水平的，Y轴是垂直的。 但是还有一个隐含的Z轴与屏幕正交。 该Z轴从屏幕伸出并延伸穿过屏幕的后部。
在2D空间中，旋转发生在点周围。 在3D空间中，围绕轴旋转。 RotationX属性围绕X轴旋转。 视觉对象的顶部和底部似乎向观察者移动或远离观察者。 类似地，RotationY围绕Y轴旋转。 视觉对象的左侧和右侧似乎向观察者移动或远离观察者。 通过扩展，基本的Rotation属性是围绕Z轴旋转。 为了保持一致性，Rotation属性可能应该命名为RotationZ，但这可能会使那些只考虑二维的人感到困惑。
ThreeDeeRotationDemo程序允许您尝试RotationX，RotationY和Rotation的组合，以及探索AnchorX和AnchorY如何影响这两个附加旋转属性：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"x:Class="ThreeDeeRotationDemo.ThreeDeeRotationDemoPage"><StackLayout Padding="20, 10"><Frame x:Name="frame"HorizontalOptions="Center"VerticalOptions="CenterAndExpand"OutlineColor="Accent"><Label Text="TEXT"FontSize="72" /></Frame><Slider x:Name="rotationXSlider"Maximum="360"Value="{Binding Source={x:Reference frame},Path=RotationX}" /><Label Text="{Binding Source={x:Reference rotationXSlider},Path=Value,StringFormat='RotationX = {0:F0}'}"HorizontalTextAlignment="Center" /><Slider x:Name="rotationYSlider"Maximum="360"Value="{Binding Source={x:Reference frame},Path=RotationY}" /><Label Text="{Binding Source={x:Reference rotationYSlider},Path=Value,StringFormat='RotationY = {0:F0}'}"HorizontalTextAlignment="Center" /><Slider x:Name="rotationZSlider"Maximum="360"Value="{Binding Source={x:Reference frame},Path=Rotation}" /><Label Text="{Binding Source={x:Reference rotationZSlider},Path=Value,StringFormat='Rotation(Z) = {0:F0}'}"HorizontalTextAlignment="Center" /><StackLayout Orientation="Horizontal"HorizontalOptions="Center"><Stepper x:Name="anchorXStepper"Minimum="-1"Maximum="2"Increment="0.25"Value="{Binding Source={x:Reference frame},Path=AnchorX}" /><Label Text="{Binding Source={x:Reference anchorXStepper},Path=Value,StringFormat='AnchorX = {0:F2}'}"VerticalOptions="Center"/></StackLayout><StackLayout Orientation="Horizontal"HorizontalOptions="Center"><Stepper x:Name="anchorYStepper"Minimum="-1"Maximum="2"Increment="0.25"Value="{Binding Source={x:Reference frame},Path=AnchorY}" /><Label Text="{Binding Source={x:Reference anchorYStepper},Path=Value,StringFormat='AnchorY = {0:F2}'}"VerticalOptions="Center"/></StackLayout></StackLayout>
</ContentPage>

这是一个示例屏幕，显示所有三个旋转的组合：

您会发现AnchorY属性影响RotationX但不影响RotationY。对于默认的AnchorY值0.5，RotationX会导致在可视对象的水平中心周围发生旋转。将AnchorY设置为0时，旋转位于对象顶部附近，对于值1，旋转位于底部附近。
同样，AnchorX属性会影响RotationY但不会影响RotationX。 AnchorX值为0会导致RotationY围绕其左边缘旋转可视对象，而值为1会导致围绕右边缘旋转。
三个平台的旋转方向是一致的，但最好结合三维坐标系的惯例进行描述：
您可能认为有许多方法可以排列正交的X，Y和Z轴。例如，X的增加值可能对应于X轴上的向左或向右移动而增加，并且Y的增加值可能对应于Y轴上的向上或向下移动。然而，当从不同方向观察轴时，许多这些变化变得相同。实际上，只有两种不同的方式来排列X，Y和Z轴。这两种方式称为右手和左手坐标系。
Xamarin.Forms中的三个旋转属性所暗示的3D坐标系统是左手：如果您将左手的食指指向增加X坐标（向右）的方向，并且您的中指朝向增加的方向Y坐标（向下），然后你的拇指指向增加Z坐标的方向，这些坐标是从屏幕出来的。
您的左手也可用于预测旋转方向：要围绕特定轴旋转，请先将拇指指向该轴上增加值的方向。要围绕X轴旋转，请将左拇指指向右侧。要围绕Y轴旋转，请将左手拇指向下。要围绕Z轴旋转，请将左拇指指向屏幕外。左手其他手指的卷曲表示正角度的旋转方向。
综上所述：

• 为了增加RotationX的角度，顶部会返回，底部会出现。
• 为了增加RotationY的角度，右侧向后，左侧出现。
• 为增加旋转角度，旋转方向为顺时针方向。

除了这些约定之外，RotationX和RotationY在三个平台之间没有太多的视觉一致性。尽管所有三个平台都实现了透视 - 即，看似最接近视图的对象部分比远离对象的部分大 - 您将看到的透视量是特定于平台的。没有可以允许微调这些视觉效果的AnchorZ属性。
但最明显的是，这些不同的旋转属性对于动画来说会非常有趣。