教程：旋转 3D 模型

在本教程中，您将了解如何在 Kanzi 应用程序中使用滑动手势旋转 3D 模型。

视频显示教程的结果。

本教程假定您了解使用 Kanzi Studio 的基础知识。熟悉 Kanzi Studio 的最佳切入点是：

• 教程：Kanzi Studio 使用入门
• 教程：创建简单的车载信息娱乐应用程序

教程资产

本教程的起点资料是存储在 <KanziWorkspace>/Tutorials/Rotation/Assets 目录中的 Rotation.kzproj Kanzi Studio 工程文件。

<KanziWorkspace>/Tutorials/Rotation/Completed 目录包含本教程已完成的工程。

创建 2D 滚动视图 (Scroll view 2D) 并将其连接到摄像机

在本节中，您将学习创建 滚动视图 (Scroll View) 节点，并将其连接到摄像机来显示您要旋转的模型。打开起点工程后，首先创建用于控制模型旋转的2D 滚动视图 (Scroll view 2D) 节点，然后将显示车辆模型的摄像机渲染变换 (Render Transformation) 属性绑定到2D 滚动视图 (Scroll view 2D) 节点中的滚动位置 (Scroll Position) 属性，以旋转车辆模型。

要创建2D 滚动视图 (Scroll view 2D) 并将其连接到摄像机：

1. 在 Kanzi Studio 中打开存储在 <KanziWorkspace>/Tutorials/Rotation/Assets 中的工程。
   工程包含Car 预设件，其中包括车辆模型、灯光、摄像机和车底地板。
   
2. 在 工程 (Project) 中按下 Alt 并右键点击 RootPage 并选择 2D 滚动视图 (Scroll view 2D)。
   滚动视图 (Scroll View)节点可用于定义根据用户输入和基于物理动画生成滚动消息的区域。
   
3. 在工程 (Project) 中选择RootPage > 2D 视口 (Viewport 2D) > Car > RootNode > Scene_Root > Camera_Root 节点，在属性 (Properties) 中点击绑定 (Bindings) 属性旁的 ，以添加该属性，并在绑定参数编辑器 (Binding Argument Editor) 中设置：
   • 属性 (Property) 为渲染变换 (Render Transformation)
   • 特性 (Attribute) 为旋转 (Rotation)
   • 表达式 (Expression) 为

     CreateRotationY({@../../../../../Scroll View 2D/ScrollViewConcept.ScrollPosition}.VectorX)

   点击保存 (Save)。
   滚动位置 (Scroll Position) 是只读属性，可用于查找 2D 滚动视图 (Scroll view 2D) 节点 x 和 y 轴的当前值。通过绑定表达式，您可以获得2D 滚动视图 (Scroll view 2D) 节点在 x 轴上的位置，以旋转 y 轴上的摄像机。
   
   
   建议

   当您在绑定参数编辑器 (Binding Argument Editor) 中编写绑定表达式时，将节点及其属性添加到表达式的最快、最精确方法是将它们从属性 (Properties) 拖到绑定参数编辑器 (Binding Argument Editor) 中的表达式 (Expression) 编辑器中。

   例如，要绑定至2D 滚动视图 (Scroll view 2D) 节点的 滚动位置 (Scroll Position) 属性：

   1. 在工程 (Project) 中选择2D 滚动视图 (Scroll view 2D) 节点。
   2. 在属性 (Properties) 中，右键点击并选择添加属性 (Add Property) > 滚动视图 (Scroll View) > 滚动位置 (Scroll Position)。
      
   3. 从属性 (Properties) 将滚动位置 (Scroll Position) 属性拖到绑定参数编辑器 (Binding Argument Editor) 中的表达式 (Expression) 字段。然后输入 .VectorX，以绑定滚动位置 (Scroll Position) 属性的 Vector_X 字段。

在预览 (Preview) 中，现在您可以在点击和拖动模型时旋转模型。但是，模型不会大幅度旋转，它围绕距离该模型不远的轴旋转。您在下一节中进行该调整。

调整摄像机和旋转属性

在本节中，您将首先设置 2D 滚动视图 (Scroll view 2D) 节点要围绕哪个轴旋转模型，以及显示模型的摄像机位置，然后使用 2D 滚动视图 (Scroll view 2D) 节点中的属性微调 滚动视图 (Scroll View) 节点如何旋转模型。

要调整摄像机和旋转属性：

1. 在工程 (Project) 中选择RootPage > 2D 视口 (Viewport 2D) > Car > RootNode > Scene_Root > Camera_Root，并在属性 (Properties) 中将渲染变换 (Render Transformation) 属性 平移 Z (Translation Z) 属性字段设置为 0。
   Camera_Root 节点包含显示场景的 摄像机 (Camera) 节点，并且可设置 摄像机 (Camera) 节点的旋转轴。
   
2. 在工程 (Project) 中选择RootPage > 2D 视口 (Viewport 2D) > Car > RootNode > Scene_Root > Camera_Root > 摄像机 (Camera)，并在属性 (Properties) 中将渲染变换 (Render Transformation) 属性平移 Z (Translation Z) 属性字段设置为 -5。
   现在，旋转模型时，它将围绕该模型中心位置的 y 轴旋转。
   
3. 在工程 (Project) 中选择2D 滚动视图 (Scroll view 2D) 节点并在属性 (Properties) 中添加并设置这些属性，以调整旋转：
   • 滚动灵敏度 (Scroll Sensitivity) 为 -100
     滚动灵敏度 (Scroll Sensitivity) 属性设置相对于开始滑动时指针的位移，位置改变了多少。值越高，滚动视图 (Scroll View) 节点控制的对象的位置变化就越大。负值使对象向相反方向移动。
   • 滑动加速 (Sliding Acceleration) 为 20
     滑动加速 (Sliding Acceleration) 属性设置您松开滑动所用的指针后对象的加速。要让滚动视图 (Scroll View) 节点控制的对象缓慢到达最终位置，使用低值。要让对象快速到达最终位置，使用高值。
   • 滑动阻力 (Sliding Drag) 为 40
     滑动阻力 (Sliding Drag) 属性设置您松开滑动所用的指针后拖动对对象的移动有多大影响。值越低，拖动越高，滚动视图 (Scroll View) 节点控制的对象的滑动停止越快。
   通过滑动加速 (Sliding Acceleration) 和滑动阻力 (Sliding Drag) 属性，您可以调整滚动视图 (Scroll View) 节点在您释放滑动指针后如何移动对象。例如，在释放鼠标按钮后，或者手指离开设备屏幕后。要调整当按住滑动指针时滚动视图 (Scroll View) 节点如何移动对象，使用拖动加速 (Dragging Acceleration)、拖动阻力 (Dragging Drag) 和 拖动脉冲 (Dragging Impulse) 属性。
   

现在，当您在预览 (Preview) 中点击、拖动模型时，它会绕模型中心的 y 轴旋转，并缓缓停止。

接下来该做什么？

在本教程中，您学习了如何使用 滚动视图 (Scroll View) 控件旋转 3D 模型。您可以进一步调整定义旋转的2D 滚动视图 (Scroll view 2D) 节点属性的值，以获得所需的结果。例如，您可以使用拖动加速 (Dragging Acceleration)、拖动阻力 (Dragging Drag) 和 拖动脉冲 (Dragging Impulse) 设置当按住滑动模型的指针时模型如何移动。

您还可以：

• 学习如何使用自定义属性控制仪表指针的位置。请参阅教程：创建仪表。
• 了解如何创建反射。请参阅教程：创建反射。

另请参阅

要详细了解可通过绑定实现的效果，请参阅使用绑定。

要了解创建Kanzi 应用程序的更多信息，请参阅教程。

要了解有关 Kanzi Studio 功能的更多信息，请参阅使用 ...。

打开导航