预览效果
具体内容
■ 这一期, 主要讲解主页中间人物效果的实现. 也就是, 在下方列表选择不同人物, 上方显示不同的人物, 播放不同的效果, 即下图的效果实现, 此部分也是采用预制 Prefab 进行实现.
英雄 Hero 预制组成
■ 英雄预制 Hero 主要四部分组成: 旋转的光, 大小变化的光球, 英雄本身, 英雄的武器. 这四部分, 都会根据英雄的不同等级, 动态的更换对应的纹理即可, 游戏过程中, 使用的动画, 无须变化.
■ 使用到的几个精灵, 都需要根据不同等级, 进行纹理的更换, 于是就封装了一个通用的方法, 传入精灵节点和纹理所在路径, 使用 cc.loader 动态加载纹理, 加载成功以后, 直接显示出来.
动画的显示
■ 这一部分, 有 3 个节点需要使用到动画: 旋转的光, 放大缩小的光球, 旋转的刀. 每一个节点都挂载一个启动播放的动画, 动画的具体实现, 直接在 Cocos Creator 编辑器内编辑好保存就行.
■ 光旋转效果, 只需要做旋转动画即可. 在动画中, 加入旋转角度, 就可以简单的实现. 显示的效果好不好, 可以预览观察, 直到调整到合适的旋转节奏就行.
■ 武器旋转效果, 和旋转的光, 是用的同一种节奏进行的, 所以本实例中, 旋转的武器和旋转的光, 都是使用上图效果中的同一个动画. 播放时, 设置成循环播放就可以实现不断的播放效果了.
■ 放大缩小光球, 也和上面动画效果差不多, 只是动画选择的是 scale 属性, 不断的进行放大缩小就行, 也是一样, 加入循环播放的控制.
■ 以上所有动画, 在游戏中是同时进行播放的, 最后看起来的效果就如同最开始的预览一样, 球和武器一起旋转, 同时光球不断的放大缩小.
武器添加
■ 这里将的武器添加, 是指初始化时, 根据不同等级的英雄, 默认添加添加到英雄周围旋转的飞刀, 都是一次性添加的, 没有动态添加几把的效果, 这个后期会讲到.
■ 英雄上所有的武器, 共用一个根节点, 根节点作为容器, 管理所有武器. 这么做的好处是, 多个武器需要做动画时, 只需要按照规则把武器添加好, 对根节点做动画即可. 添加的方式是, 以中心点为圆点, 根据武器数, 计算出每把武器之间的角度, 然后算出每把武器的 x 坐标值和 y 坐标值.
■ 假设武器锚点离中心点的偏移量是 Offset, 角度是 angle, 那么就容易算出武器的横坐标 x = Offset * sin(angle), 同理, 可算出武器的纵坐标 y = Offset * cos(angle). 按照这个原理, 就可以实现武器按照角度分布, 添加到武器根节点上. 计算过程中, 需要注意角度和弧度的转换, 不同版本的 Cocos Creator 设置角度的 API 可能有差异, 这个看官方文档就行.
选中未选中处理
■ 这里, 有添加一个额外处理, 正常情况下, 人物使用的纹理和选中使用的纹理, 是有差异的, 这个功能, 主要是用在后期的游戏中的, 目前只需要关注有这个功能即可. 这个实现, 也很简单, 就是监听触摸事件, 触摸开始更换一个纹理, 触摸结束, 再还原回来就行.
■ 英雄有两种状态, 进攻状态和防御状态, 按下时是进攻, 松开以后是防御状态. 攻击状态下, 武器会扩大攻击范围, 武器有一定的倾斜度. 防御状态下, 武器笔直向外, 离英雄更近. 只需要单独的做每个武器做动画, 修改武器的位置和偏移角度, 计算方法类似上面的添加武器.
来源: https://www.cnblogs.com/caizj/p/12143254.html