mirror of
https://github.com/ifengzp/cocos-awesome.git
synced 2024-12-26 19:59:20 +00:00
63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
const { ccclass, property } = cc._decorator;
|
||
|
||
@ccclass
|
||
export default class Roller extends cc.Component {
|
||
@property({ type: cc.Node, tooltip: '操控杆的控制点' })
|
||
controlDot: cc.Node = null;
|
||
@property({ type: cc.Node, tooltip: '操控杆' })
|
||
joystick: cc.Node = null;
|
||
@property(cc.Node)
|
||
movableStar: cc.Node = null;
|
||
|
||
movableFlag: boolean = false;
|
||
radian: number = 0;
|
||
speed: number = 150;
|
||
onLoad() {
|
||
this.initTouchEvent();
|
||
}
|
||
|
||
initTouchEvent() {
|
||
this.node.on(cc.Node.EventType.TOUCH_START, this.touchStartEvent, this);
|
||
this.node.on(cc.Node.EventType.TOUCH_MOVE, this.touchMoveEvent, this);
|
||
this.node.on(cc.Node.EventType.TOUCH_END, this.touchEndEvent, this);
|
||
this.node.on(cc.Node.EventType.TOUCH_CANCEL, this.touchEndEvent, this);
|
||
}
|
||
|
||
touchStartEvent(event) {
|
||
let touchPos = this.node.convertToNodeSpaceAR(event.getLocation());
|
||
const distance = touchPos.len();
|
||
const radius = this.node.width / 2 - this.controlDot.width / 2;
|
||
|
||
// 以x轴正方向为基准，计算偏移量
|
||
this.radian = cc.v2(1, 0).signAngle(touchPos);
|
||
const offsetX = Math.cos(this.radian) * radius;
|
||
const offsetY = Math.sin(this.radian) * radius;
|
||
this.controlDot.setPosition(radius > distance ? touchPos : cc.v2(offsetX, offsetY));
|
||
|
||
this.movableFlag = true;
|
||
}
|
||
|
||
touchMoveEvent(event) {
|
||
let touchPos: cc.Vec2 = this.node.convertToNodeSpaceAR(event.getLocation());
|
||
const distance = touchPos.len();
|
||
const radius = this.node.width / 2 - this.controlDot.width / 2;
|
||
|
||
this.radian = cc.v2(1, 0).signAngle(touchPos);
|
||
const offsetX = Math.cos(this.radian) * radius;
|
||
const offsetY = Math.sin(this.radian) * radius;
|
||
|
||
this.controlDot.setPosition(radius > distance ? touchPos : cc.v2(offsetX, offsetY));
|
||
}
|
||
|
||
touchEndEvent() {
|
||
this.movableFlag = false;
|
||
this.controlDot.setPosition(cc.v2(0, 0));
|
||
}
|
||
|
||
update(dt) {
|
||
if (!this.movableFlag) return;
|
||
this.movableStar.x += Math.cos(this.radian) * dt * this.speed;
|
||
this.movableStar.y += Math.sin(this.radian) * dt * this.speed;
|
||
}
|
||
}
|