ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

CocosCreator游戏开发(四)实现摇杆控制角色功能

2020-08-22 23:31:47  阅读:743  来源: 互联网

标签:控件 游戏 CocosCreator 代码 摇杆 https joystick com


时隔3年,我又开始继续写这个系列的帖子了,也不知道是会写完全系列,还是再次夭折。
废话不多。直接开始主题了
主要实现的功能点包含这些内容:通过摇杆控制角色进行八方位移动,并按照各方位播放对应移动动画
效果图如下:

本次案例其实都是拼凑网上别人的一些现成代码,然后进行整合梳理

涉及到的相关内容如下:

参考代码如下:
1.Cocos Creator 地图滚动&摄像机人物跟随
地址:https://www.bilibili.com/video/BV1et411J7iC
2.joystick摇杆控件
代码地址:https://github.com/YunYouJun/cocos-creator-joystick
在线演示:https://www.yunyoujun.cn/cocos-creator-joystick/
3. Animation动画创建
教程地址:http://www.cocoachina.com/bbs/read.php?tid-458312.html
我其实也只是代码的搬运工,通过对以上三部分的整合,最终就实现了我想要的效果。

开始介绍项目

场景结构


场景中分别包含了以下控件:

  • MainCamera 负责绘制UI
  • RoleCamera 负责绘制角色(之后的遥感其实也是控制这个摄像头的坐标移动)
  • MapView 地图(里面包含了一些地图相关的内容,在参考代码里面的视频有做解释,我这里不做详细介绍了)
  • Role 主角,主要的控件,相关的控制代码都挂在主角上面
  • joystick 摇杆控件,该部分代码可以直接通过参考代码2去下载,然后直接使用即可。

代码结构


其实需要讲解的代码也就两部分:joystick.js 与Role.JS

Joystick组件

属性(Properties)

  • dot :摇杆操纵点
  • ring :摇杆背景节点
  • joystickType :触摸类型(跟随,固定两种)
  • directionType :方向类型(4方向,8方向,全方位)
  • _stickPos :摇杆所在位置
  • _touchLocation :触摸位置

函数(Functions)

  • _initTouchEvent : 初始化
  • _onChangeJoystickType : 更改触摸类型
  • _touchStartEvent : 当手指按下时触发,判断触摸类型,并根据触摸类型执行相应动作
  • _touchMoveEvent : 当手指按住摇杆控件时持续触发,先判断按下的位置是否相同,如果相同,则不做处理。
  • _touchEndEvent : 当手指抬起时触发,结束相关动作

Role组件

主要函数(Functions)

  • _updateCameraPosition :更新摄像机位置
  • _getTilePos : 计算摇杆角度
  • onTouchMove : 按住摇杆时持续触发
  • getCalculaAngle : 将摇杆移动的坐标进行角度转换,转换之后用来判断朝哪个方向移动了
  • getfwinfo : 根据角度判断角色应该朝哪个方向
  • move : 移动摄像头
  • update :

主要逻辑顺序

当用户按住摇杆时触发onTouchMove 事件,判断移动方向,切换角色动画。

最后就是贴代码了
链接:https://share.weiyun.com/8WRBYpR5 密码:jny2wj

接下来准备实现技能按钮部分,也不知道可以不可以实现,如果各位有好的参考代码也欢迎各位提供我学习参考下,谢谢

标签:控件,游戏,CocosCreator,代码,摇杆,https,joystick,com
来源: https://www.cnblogs.com/PleaseInputEnglish/p/13544031.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有