【Unity】UI画线工具
最近恰好遇到在图片上画线标记路径的需求,需要动态地画很多线,感觉做帧动画的话美术工作量有点大,所以做了一个功能比较简单的UI画线工具 UIPathwaySystem : https://greenbamboo.coding.net/p/UIPathwaySystem/d/UIPathwaySystem/git 。
以下内容是对该工具的简介,内容与上面链接中给出的项目主页的说明相同。
基于UGUI制作的简单画线工具。
功能列表:
- 从多个起点开始绘制线段
- 单条线段分裂成多条线段
- 多条线段汇合成单条线段
- 线段跳转
- 设置线段颜色
使用限制:
- 不支持绘制平滑曲线(绘制平滑曲线可以考虑使用专门的图表插件)
- 不支持分辨率动态适配(可以实现但处理起来比较繁琐)
如何使用:
将 UGUIPathwaySystem/Prefabs/UIPathway.prefab 添加到任意 Canvas
对象下,这将会在Scene中添加一个 UIPathway
对象。 UIPathway
对象使用 UIWaypoint
对象来标记线路节点,在UIPathway
对象下添加、排列 UIWaypoint
对象并设置其间的连接关系即可设定画线规则。
在 UIWaypoint
对象中包含了一些属性,它们分别是:
Type
:节点类型None
:未指定功能的节点,系统将会提示错误Start
:起点,系统将会从起点向后绘制线段Relay
:中继点,用于连接前后的点Jump
:跳跃点,系统不会从该点向后绘制线段,而是直接跳转到后续节点开始绘制End
:终点,系统将会在终点结束绘制
Time
:从开始绘制线段到绘制到当前点所需经历的时间Color
:节点颜色(当连线时使用后一个节点的颜色作为线段的颜色)Nexts
:后续的节点AutoCalcTime
[EditorOnly]:表示是否允许控制器根据节点之间的距离自动计算Time字段的值
在UIPathway
对象中包含了一些属性,它们分别是:
LineWidth
:线段宽度(像素)HeadRadius
:线头半径(像素)LineTemplate
[EditorOnly]:线段模板,用于生成新的线段HeadTemplate
[EditorOnly]:线头模板,用于生成新的线头Waypoints
[EditorOnly]:当前已经添加的线段节点Refresh
[EditorOnly]:刷新数据(需要手动刷新数据才能检测到线段节点的变更)SpeedInPixel
[EditorOnly]:画线速度,用于计算节点的Time字段的值AutoCalcWaypointsTime
[EditorOnly]:自动计算节点的Time字段的值(只会影响AutoCalcTime==true
的节点)ColorOverride
[EditorOnly]:用于统一设置所有子节点的颜色OverrideColors
[EditorOnly]:将所有子节点的颜色设置为ColorOverride
字段的颜色SortWaypointsByTime
[EditorOnly]:是否根据到达时间属性来对线段节点进行排序,辅助调试
当设置好画线规则后,点击 UIPathway
对象的 Inspector 面板中 UIPathController
组件下的 Refresh 按钮,系统将会检索当前添加的节点。
然后进入 Play 模式,调用 UIPathController
对象的 Play()
、 Pause()
、 Clear()
方法分别可以实现播放、暂停和清除绘制功能。其中 Play()
方法能够接受一个可选的 time
参数,该参数可以让画线工具将线段绘制到指定时间的状态。
备注:
上文中提到的 HeadTemplate 和 LineTemplate 是两个可以独立于画线工具使用的组件。 HeadTemplate 对象带有一个用于绘制正多边形的 RegularPolygonUIMesh
脚本;LineTemplate 对象带有一个用于绘制线段的 LineUIMesh
脚本,该脚本也可以用于绘制矩形(调整线宽即可)。
转载自原文链接, 如需删除请联系管理员。
原文链接:【Unity】UI画线工具,转载请注明来源!