CocosCtreator知识点3:场景编辑中的视图操作

场景编辑中的视图操作

在场景编辑器中，可以调整场景编辑视图，变换节点的旋转、位移、缩放等属性。这里主要记录场景编辑视图的移动和定位，以及移动节点时的辅助功能“吸附工具”。

操作场景视图

在Creator编辑器中，有2D和3D两种视图背景以供编辑。2D视图就编辑一些2D的东西（UI之类的），3D视图主要用于编辑3D的元素。点击场景编辑器面板左上角的2D/3D图标就可以切换对应的视图。

• 2D场景视图
  在2D场景视图中：
  • 视图平移
    如果想要平移视图，按住鼠标右键上下左右拖动就可以了。这也是编辑UI时最常用的功能。
    另外，按住空格键，在场景编辑面板中拖动鼠标也可以平移；单独按住鼠标中键拖动也可以平移。
    后面两种在2D场景中基本不会使用。我猜官方提供了后面两种方式主要是为了同步3D场景中的操作，这个下面会说。
  • 视图缩放
    通过鼠标滚轮就可以缩放，需要注意的是缩放的中心点是以鼠标悬停的位置为准。
  • 聚焦节点
    选中节点，按下F键，视图会平移到场景编辑器面板显示区的中心，并缩放直可以完全显示节点的视图。
• 3D场景视图
  在3D场景视图中：
  • 视图平移
    在3D视图中，场景编辑时鼠标右键有了其它的功能，无法再通过鼠标右键来平移视图。不过2D场景视图中的后面两种方法保留了下来。也就是通过按住鼠标中键拖动来平移视图；或者按住空格键，在场景编辑面板中拖动鼠标也可以平移编辑视图。
  • 视图缩放
    和2D操作一样，通过鼠标滚轮就可以缩放。
  • 聚焦节点
    和2D操作一样，选中节点，按下F键，视图会平移到场景编辑器面板显示区的中心，并缩放直可以完全显示节点的视图。
  • 视图旋转
    在3D场景中，场景编辑视图可以旋转，方便观察每个面并操作。在场景编辑器面板中，按住opt/alt+鼠标左键，场景会以视图中心点为中心进行旋转。
  • 漫游
    当实现某一阶段的编辑操作后可能想要全方位的查看效果。虽然可以通过以上的操作方式进行查看，但Creator仍提供了一种集成的方式以方便观察，也就是相机漫游。在场景编辑器中按下鼠标右键，面板左下角就会显示Q/W/E/A/S/D的漫游快捷键，配合对应的按键可以来平移或缩放视图进行观察。（我猜这也是为什么鼠标右键不能再平移视图，因为它被占用了）
  • 吸附操作
    在3D场景中，Creator提供了“顶点吸附”和“表面吸附”两种吸附操作。吸附操作可以在我们对场景里的物体进行变换操作时定位更准确，这在对3D场景中的物体进行编辑时特别有用。当选中一个节点并准备对其进行移动变换时，面板左下角会自动显示吸附操作的快捷键的提示。
    顶点吸附：
    快捷键 v ，可以更精准的使变换节点的顶点对齐到另一物体的某顶点。
    表面吸附：
    快捷键 Ctrl/Command + Shift，对于有碰撞体的物体，表面吸附会吸附在碰撞体的表面；而对于没有碰撞体的物体，会吸附在物体表面；
    具体操作：
    当出现快捷键时，按下对应的快捷键。物体会出现一个白色半透的控制块：
    （这里需要注意一下，以控制块为中心的控制手柄已经不是原来节点锚点的控制手柄了，而是吸附点的控制手柄。你可以改变控制点相对节点中心点的位置。）
    然后鼠标点击控制块进行拖动，松开时物体就会移动到对应的位置。