team1_nc/assets/script/before/map/MapMove.ts

import Util from "../util/Util";

const { ccclass, property } = cc._decorator;
/**
 * @description 地图移动控制器
 * @author Soonsky
 */
@ccclass
export class MapMove extends cc.Component {
    @property({ type: cc.Node, tooltip: "地图容器" }) map: cc.Node = null;

    private canvas: cc.Node = null;
    private startPoint: cc.Vec2;
    start() {
        this.canvas = cc.find('Canvas');
        this.node.on(cc.Node.EventType.TOUCH_START, this.onMapTouchBegin, this);
    }

    onDestroy() {
        this.node.off(cc.Node.EventType.TOUCH_START, this.onMapTouchBegin, this);
    }

    private isDoubleTouch = false;
    private onMapTouchBegin(e): void {
        this.startPoint = e.touch._point;
        this.node.on(cc.Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
        this.node.on(cc.Node.EventType.TOUCH_END, this.onTouchEnd, this);
        this.node.on(cc.Node.EventType.TOUCH_CANCEL, this.onTouchEnd, this);
    }

    private onTouchMove(e: cc.Event.EventTouch): void {
        let touches = e.getTouches();
        if (touches.length == 1) {
            if (this.isDoubleTouch) {
                return;
            }
            let point = e.touch.getLocation();
            let offsetX = point.x - this.startPoint.x;
            let offsetY = point.y - this.startPoint.y;
            this.move(new cc.Vec2(offsetX, offsetY));
            this.startPoint = point;
        } else if (touches.length == 2) {
            this.isDoubleTouch = true;
            let b_distance = cc.Vec2.distance(touches[0].getStartLocation(), touches[1].getStartLocation());
            let e_distance = cc.Vec2.distance(touches[0].getLocation(), touches[1].getLocation());
            let target = this.map.scaleX;
            if (b_distance > e_distance) {
                target = Util.clamp(target - 0.01, 1.3, 1.7);
            } else {
                target = Util.clamp(target + 0.01, 1.3, 1.7);
            }
            this.map.scale = target
            // this.move(this.node.position);
        }
    }

    private onTouchEnd(e: cc.Event.EventTouch): void {
        this.startPoint = cc.Vec2.ZERO;
        this.node.off(cc.Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
        this.node.off(cc.Node.EventType.TOUCH_END, this.onTouchEnd, this);
        this.node.off(cc.Node.EventType.TOUCH_CANCEL, this.onTouchEnd, this);
        if (e.getTouches().length == 0) {
            this.isDoubleTouch = false;
        }
    }

    update() {
        let target = this.map.scaleX;
        if (target < 1.5) {
            target += 0.001;
        } else {
            target -= 0.001;
        }
        this.map.scale = target
    }

    private move(offset: cc.Vec2): void {
        this.startPoint = cc.Vec2.ZERO;
        this.node.setPosition(this.confirmPosition(new cc.Vec2(this.node.position.x + offset.x, this.node.position.y + offset.y)));
    }
    /**确认移动到的坐标是否合法 */
    private confirmPosition(pos: cc.Vec2): cc.Vec3 {
        let clampX = Util.clamp(pos.x, -(this.map.width * (this.map.scaleX - 0.2) / 2 - this.canvas.width / 2), this.map.width * (this.map.scaleX - 0.2) / 2 - this.canvas.width / 2);
        let clampY = Util.clamp(pos.y, -(this.map.height * (this.map.scaleY - 0.2) / 2 - this.canvas.height / 2), this.map.height * (this.map.scaleY - 0.2) / 2 - this.canvas.height / 2);
        return new cc.Vec3(clampX, clampY, 0);
    }

    /**将视角中心移动到指定位置 */
    public moveTo(pos: cc.Vec3): void {
        let toPoint = new cc.Vec2(-pos.x * this.map.scaleX, -pos.y * this.map.scaleY);
        cc.tween(this.node).to(0.5, { position: this.confirmPosition(toPoint) }, { easing: "sineOut" }).start();
    }

}