使用教程

布局工具

ThunderFire UX Tool提供了基础的UI布局工具,帮助设计师在Scene中进行快速高效的界面拼接。 布局工具可在【ThunderFireUXTool-设置 (Setting)-功能开关】中选择开启或关闭。


对齐与分布

对齐与排列工具位于Inspector面板、Rect Transform组件下,提供左对齐、水平居中对齐、右对齐、顶对齐、垂直居中对齐、底对齐共6种对齐方式,以及竖向分布和横向分布共2种分布方式。


对齐 将2个或以上对象沿所选方向对齐。

  • 左对齐:将2个或以上对象的位置,以最左侧对象的左边缘为基准对齐。
  • 水平居中对齐:将2个或以上对象的位置,以对象整体的垂直中心线为基准对齐。
  • 右对齐:将2个或以上对象的位置,以最右侧对象的右边缘为基准对齐。
  • 顶对齐:将2个或以上对象的位置,以最上方对象的上边缘为基准对齐。
  • 垂直居中对齐:将2个或以上对象的位置,以对象整体的水平中心线为基准对齐。
  • 底对齐:将2个或以上对象的位置,以最下方对象的下边缘为基准对齐。

注意:未选中2个或以上对象时,对齐工具不可用;所选对象中对象相关参数被锁住时(如因受Layout组件控制而无法改变时),对齐工具不可用。


分布 将3个或以上对象沿所选方向进行等距排列。

  • 横向分布:选中3个或以上对象,在保持水平方向排列顺序不变、左右两端对象位置不变的情况下,通过改变中间对象位置,使相邻对象之间左右边缘距离相等。
  • 竖向分布:选中3个或以上对象,在保持垂直方向排列顺序不变、上下两端对象位置不变的情况下,通过改变中间对象位置,使相邻对象之间上下边缘距离相等。

注意:未选中3个或以上对象时,分布工具不可用;所选对象中有对象相关参数被锁住时(如因受Layout组件控制而无法改变时),分布工具不可用。



参考线

在Scene中添加参考线,当拖动图片或文字等对象靠近参考线时,对象可以自动将边缘吸附到附近的参考线上。


添加参考线 在2D场景或Prefab中,点击ToolBar中的参考线按钮,可以在场景中添加一组参考线。

移动参考线 拖动已创建的参考线可以改变其位置。当移动参考线靠近场景中的对象时,参考线会自动吸附至对象边缘。

删除参考线 在已创建的参考线上点击鼠标右键,选择“删除”可以在场景中删除参考线。



移动吸附

在Scene中对多个对象进行排布编辑时,对象之间会产生多种自动吸附效果,包括等距吸附、边缘和中心吸附。

等距吸附

  • 选中对象A进行移动,当它与B之间的距离接近B与另一侧的C之间的距离时,对象A会自动吸附到等距的精确位置,并显示该间距的数字标识。(此处距离指两个物体相对的边缘线之间的距离)
  • 选中对象A进行移动,当它与B之间的距离接近A与另一侧的C之间的距离时,对象A会自动吸附到等距的精确位置,并显示该间距的数字标识。(此处距离指两个物体相对的边缘线之间的距离)

 

边缘/中心吸附

  • 选中对象A进行移动,当其水平(竖直)中心线或边缘线靠近B的水平(竖直)中心线、边缘线或边缘延长线时,前者会自动吸附对齐到后者上。
面向开发者的界面开发解决方案
feedback