飞机大战知识点总结

1.创建Player.ts文件，把该文件添加到Player组件上

2.编写Player.ts

import { _decorator, Component, EventTouch, Input, input, Node, Vec3 } from 'cc';
const { ccclass, property } = _decorator;
@ccclass('Player')
export class Player extends Component {
    protected onLoad(): void {
    	// 1. 注册触摸事件
        input.on(Input.EventType.TOUCH_MOVE,this.onTouchMove,this);
    }
    protected onDestroy(): void {
        // 2.注销触摸事件
        input.off(Input.EventType.TOUCH_MOVE,this.onTouchMove,this);
    }

    // 触摸方法
    onTouchMove(event:EventTouch){
    	// this.node.position：获取自身Player的位置
        // event中 getDeltaX()，getDeltaY()：用来获取移动过程中的位置偏移
        // 通过这个偏移，来控制Player的位置偏移
        // this.node.setPosition：设置x，y，z轴的位置 
        const p = this.node.position;
        this.node.setPosition(p.x+event.getDeltaX(),p.y+event.getDeltaY(),p.z)
    }
}

上述代码保存在编辑器里运行看下效果，会发现飞机会移动到视图外边，

下边就要限制移动边界的问题

通过触摸移动，得到了4个边界值，x轴为-230和230，y轴为380和-380
有个了这个边界值，需要再把Player.ts优化下代码。

import { _decorator, Component, EventTouch, Input, input, Node, Vec3 } from 'cc';
const { ccclass, property } = _decorator;
@ccclass('Player')
export class Player extends Component {
    protected onLoad(): void {
        // 1. 注册触摸事件
        input.on(Input.EventType.TOUCH_MOVE,this.onTouchMove,this);
    }
    protected onDestroy(): void {
        // 2.注销触摸事件
        input.off(Input.EventType.TOUCH_MOVE,this.onTouchMove,this);
    }
    // 触摸方法
    onTouchMove(event:EventTouch){
        // this.node.position：获取自身Player的位置
        // event中 getDeltaX()，getDeltaY()：用来获取移动过程中的位置偏移
        // 通过这个偏移，来控制Player的位置偏移
        // this.node.setPosition：设置x，y，z轴的位置 

        const p = this.node.position;

        // 要移动的：目标坐标
        let targetPos = new Vec3(p.x+event.getDeltaX(),p.y+event.getDeltaY(),p.z);

        if(targetPos.x < -230){
            targetPos.x = -230
        }

        if(targetPos.x > 230){
            targetPos.x = 230
        }

        if(targetPos.y < -380){
            targetPos.y = -380
        }

        if(targetPos.y > 380){
            targetPos.y = 380
        }
        
        this.node.setPosition(targetPos)
    }
}