记一次不使用代码库,手写游戏内角色点击移动(也可应用到按键移动)

2026-03-17

记一次不使用代码库,手写游戏内角色点击移动(也可应用到按键移动)

代码还可优化,也可以线性插值(Lerp)算法来实现一下平滑移动
代码库版本:cocos 3.8

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
import { _decorator, Component, Node, UITransform, v3 } from 'cc';
const { ccclass, property } = _decorator;
@ccclass('MapScript')
export class MapScript extends Component {
    @property(Node)
    people: Node;
    private MoveXInterval = null;
    private MoveYInterval = null;
    start() {
        this.node.on(Node.EventType.TOUCH_START, this.peopleMove, this);
    }
    peopleMove(event){
        clearInterval(this.MoveXInterval);
        clearInterval(this.MoveYInterval);
        // 获取点击坐标,并转为本地坐标系
        let uiTransform = this.node.getComponent(UITransform);
        let uiLocation = uiTransform.convertToNodeSpaceAR(v3(event.getUILocation().x, event.getUILocation().y,0));
        // 获取原始坐标
        let oldx = this.people.position.x;
        let oldy = this.people.position.y;
        // 计算点击坐标喝原始坐标差值
        let xnum = uiLocation.x - oldx;
        let ynum = uiLocation.y - oldy;
        // 步入点击坐标
        this.peopleMoveX(xnum, uiLocation.x);
        this.peopleMoveY(ynum, uiLocation.y);
    }
    peopleMoveX(xnum, touchx){
        this.MoveXInterval = setInterval(()=>{
            if(xnum > 0){
                if(this.people.position.x < touchx){
                    let newX = this.people.position.x + 2;
                    this.people.setPosition(newX, this.people.position.y, 0);
                }else{
                    clearInterval(this.MoveXInterval);
                }
            }else{
                if(this.people.position.x > touchx){
                    let newX = this.people.position.x - 2;
                    this.people.setPosition(newX, this.people.position.y, 0);
                }else{
                    clearInterval(this.MoveXInterval);
                }
            }
        }, 20);
    }
    peopleMoveY(ynum, touchy){
        this.MoveYInterval = setInterval(()=>{
            if(ynum > 0){
                if(this.people.position.y < touchy){
                    let newY = this.people.position.y + 2;
                    this.people.setPosition(this.people.position.x, newY, 0);
                }else{
                    clearInterval(this.MoveYInterval);
                }
            }else{
                if(this.people.position.y > touchy){
                    let newY = this.people.position.y - 2;
                    this.people.setPosition(this.people.position.x, newY, 0);
                }else{
                    clearInterval(this.MoveYInterval);
                }
            }
        }, 20);
    }
    update(deltaTime: number) {
       
    }
}