Cocos Creator模拟射箭效果 | 附代码

2020-03-02 13:48:54 浏览数 (1)

1

获取代码

关注微信公众号,发送【射箭】获取代码

2

效果预览

3

操作方法

点击屏幕,屏幕出现起始位置标志的圆点,不松开手指,滑动屏幕,控制力度和方向,移动距离越大,弓箭拉伸效果越大,松开以后,箭将沿着结束点到起始点方向射出去。

4

弓箭拉伸效果实现原理

弓箭所有内容放置在一个空节点weapon上,控制逻辑挂在weapon上,实现逻辑的控制。

要注意几个节点的锚点,根据UI需要调整节点的锚点位置,以达到拉伸过程中显示的最佳效果,本demo中怎么设置的,可以参考代码。

弓箭由4部分组成:弓、箭、上弦、下弦,如上说明,调整各节点的位置,以达到最佳视觉效果,如上弦的锚点设置成(0.5, 1),下弦的锚点设置成(0, 0.5),这样在旋转的时候,只需要修改弦的旋转角度和修改弦的长度即可,而不必关心弦往哪个方向变化。其他节点的锚点设置类似,弓只需要旋转角度,箭只需要修改水平方向位置。

在获取到力度和方向以后,通过修改箭的位置,上弦和下弦的旋转方向,实现弓箭拉伸的效果,弓箭旋转,直接通过选中武器根节点的方向实现。

5

力度控制实现原理

根据触摸的起始点和结束点,计算两点之间的距离,力度控制逻辑,根据距离的长短,实现力度大小的控制,超过了最大力度,直接使用最大力度。

ui

0 人点赞