Joystick

虚拟摇杆

依赖 TCGSDK 使用,建议在 TCGSDK.init 内的回调函数 onConnectSuccess 中使用

Constructor

new Joystick(params)

Example
// 如果是通过 Script 标签引入
const j = new CloudGamingPlugin.joystick({
 zone: document.querySelector('#plugin-point'),
});


// 如果是通过 ES module import
const j = new Joystick({zone: document.querySelector('#plugin-point')})
Parameters:
Name Type Description
params Object
Properties
Name Type Attributes Default Description
zone HTMLElement <optional>
document.body

摇杆挂载节点,默认 document.body

size number <optional>
100

摇杆尺寸,默认 100px

position Object <optional>

相对于挂载节点的位置,默认值 {top: 50, left: 50},及根据size 剧中

Properties
Name Type Attributes Default Description
top number <optional>
50

top

left number <optional>
50

left

bottom number <optional>

bottom

right number <optional>

right

lockX boolean <optional>
false

锁定X 轴移动, 默认值 false

lockY boolean <optional>
false

锁定Y 轴移动, 默认值 false

type 'dpad_wasd' | 'dpad_updown' <optional>
'dpad_wasd'

两种摇杆样式 wasd/上下左右, 默认值 dpad_wasd

joystickImage Object <optional>

摇杆背景图, http/https 地址,不填采用默认图片

Properties
Name Type Attributes Description
back string <optional>

底图, http/https 地址,不填采用默认图片

front string <optional>

按钮图, http/https 地址,不填采用默认图片

frontPressed string <optional>

按钮被按下后的图片, http/https 地址,不填采用默认图片

restJoystick boolean <optional>
true

touchend 后复位摇杆,默认值 true

Methods

on(type, handler) → {void}

监听摇杆事件

Parameters:
Name Type Description
type Joystick~JoystickEventTypes

监听事件

handler Joystick~JoystickOutputData

回调函数 response data 为 JoystickOutputData

Returns:
Type
void

destroy() → {void}

销毁

Returns:
Type
void

Type Definitions

JoystickEventTypes

摇杆事件类型

Type:
  • 'start' | 'move' | 'end' | 'added'

JoystickOutputData(data)

摇杆回调数据结构

Parameters:
Name Type Description
data Object
Properties
Name Type Description
angle Object

角度信息

Properties
Name Type Description
degree number

角度

radian number

半径

distance number

距离

force number

力度

identifier number

id 唯一标识

lockX boolean

锁定 X 轴

lockY boolean

锁定 Y 轴

position Object

位置信息

Properties
Name Type Description
x number

x 坐标

y number

y 坐标

raw Object

原始信息

Properties
Name Type Description
distance number

距离

position Object

位置信息

Properties
Name Type Description
x number

x 坐标

y number

y 坐标

vector Object

向量

Properties
Name Type Description
x number

x

y number

y

direction Object

方向

Properties
Name Type Description
angle number

角度

x number

x

y number

y