yes7rose/cocos-creator-joystick

🕹 Cocos Creator Joystick Demo 虚拟摇杆

cocos-creator-joystick

Cocos Creator 虚拟摇杆样例

• Version 0.2.0 for Cocos Creator 3.0
• Version 0.1.0 for TypeScript (Cocos Creator 2.x)
• Version 0.0.2 for JavaScript (Cocos Creator 2.x)

中文文档 | English Docs

在线预览: cocos-creator-joystick

使用

下载

Releases

通过文件导入

Cocos Creator v3.x -> 文件 -> 资源导出... -> 选择 -> assets/demo.fire Cocos Creator v3.x -> 文件 -> 资源导入...

通过 Git

git clone https://github.com/YunYouJun/cocos-creator-joystick.git

将其作为项目，通过 Cocos Creator v3.x 打开。

你可以在 demo 场景中查看样例。

主菜单：开发者 -> VS Code 工作流 -> 更新 VS Code 智能提示数据 来更新已有项目的 creator.d.ts 文件。

功能

• 虚拟摇杆类型
  • 固定
  • 跟随
• 玩家
  • 旋转
  • 移动
• 触摸感应位置（自定义 Joystick 宽高）
  • 全屏感应
  • 半屏感应
• 节点间解耦（只需要监听 Touch 事件，而无需挂载 Player 节点至 Joystick，可控制任意多个 Player）

虚拟摇杆

属性	类型	默认值	描述	可自定义
joystickType	JoystickType.FIXED / JoystickType.FOLLOW	JoystickType.FIXED	虚拟摇杆类型	√
ring	cc.Node	-	摇杆背景节点	√
dot	cc.Node	-	摇杆操纵点	√

玩家

属性	类型	默认值	描述	由虚拟摇杆控制	可自定义
rigidbody	boolean	false	刚体（物理）模式	×	x
moveDir	Vec2	cc.v2(0, 1) // 竖直向上	初始移动方向	√	√
_speedType	SpeedType.STOP / SpeedType.NORMAL / SpeedType.FAST	SpeedType.NORMAL	速度类型	√	×
_moveSpeed	cc.Integer	0	移动速度	×	×
stopSpeed	cc.Integer	0	停止时速度	×	√
normalSpeed	cc.Integer	100	正常速度	×	√
fastSpeed	cc.Integer	200	加快时速度	×	√

项目结构

逻辑文件均位于 assets/script 目录下

文件名	描述	功能
Joystick.js	虚拟摇杆脚本文件	存储 Joystick 主逻辑 （包含一些类型定义与全局监听实例）
Player.js	玩家脚本文件	监听 Joystick 发射的事件（可根据需要自行修改删除）
UI.js	UI	提供在线预览页面，玩家切换摇杆类型功能。（不需要可直接删除）

其他

欢迎 Star, Issues, Pull requests 。

推荐编码规范

开发

构建

npm run build

部署

npm run deploy

Todo

• Keep half screen layout (now is fixed width)