Giter Club home page Giter Club logo

cocos-creator-joystick's Introduction

cocos-creator-joystick

Cocos Creator 虚拟摇杆样例

GitHub release (latest by date) Cocos Creator version GitHub top language GitHub code size in bytes

中文文档 | 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)

cocos-creator-joystick's People

Contributors

yunyoujun avatar ca39-quincy avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.