Laya实现单指旋转,双指缩放与平移


export default class MobileModelScript extends Laya.Script3D{// ES6类的继承,继承父类的属性和方法。继承实质:先创建父类的实例对象this,然后再用子类的构造函数修改this;
	constructor(){
		// super作为对象使用的话可以用来调用父类中原型上的方法(不能调用实例的方法属性-constructor中的),作为函数使用代表父类的构造函数
		super();// 表示父类的构造函数,调用父类的constructor,用来新建父类的this对象;子类必须在constructor方法中调用super()方法,因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工;如果不调用super,子类就得不到this对象;
		this.scene = null;
		this.lastPosition = new Laya.Vector2(0, 0);
		this.distance = 0.0;
		this.disFirstTouch = new Laya.Vector2(0, 0);
		this.disLastTouch = new Laya.Vector2(0, 0);
		this.isTwoTouch = false;
		this.first = true;
		this.twoFirst = true;
		this.rotate = new Laya.Vector3(0,0,0);
		this.sprite3DSacle = new Laya.Vector3(0,0,0);
		//模型默认自转,当用户单击屏幕时取消自转,双击屏幕重新按照初始角度,初始位置和当前缩放值旋转
		this.modelRotate = true;
		this.clicked = 1;
		this.clickedTime = {
			'timeA':'',
			'timeB':''
		}
	}
	
    /**
     * 第一次执行update之前执行,只会执行一次
     */
	onStart(){
		this.scene =  this.owner.parent;
		// 存储模型的初始旋转角度
		this.firstRotate = new Laya.Quaternion(this.owner.transform.rotation.x,this.owner.transform.rotation.y,this.owner.transform.rotation.z,this.owner.transform.rotation.w);
		// 存储模型初始位置
		this.firstPosition = new Laya.Vector3(this.owner.transform.position.x,this.owner.transform.position.y,this.owner.transform.position.z);
		// Laya.stage.on(Laya.Event.MOUSE_OUT,this,this.onMouseOut);
		Laya.stage.on(Laya.Event.MOUSE_UP,this,this.onMouseUp);
	}

    /**
     * 每帧更新时执行
     */
	onUpdate(){
		var mod = this.owner;
		if (this.modelRotate) {
			//自动旋转
			mod.transform.rotate(new Laya.Vector3(0,0.5,0),false,false);
		}
		// 获取触摸点个数
		let touchCount = this.scene.input.touchCount();
		if (1 === touchCount){
			//判断是否为两指触控,撤去一根手指后引发的touchCount===1
			if(this.isTwoTouch){
				return;
			}
			//获取当前的触控点,数量为1
			let touch = this.scene.input.getTouch(0);// 获取触摸点,参数代表索引
			//是否为新一次触碰,并未发生移动
			if (this.first){
				//获取触碰点的位置
				this.lastPosition.x = touch._position.x;
				this.lastPosition.y = touch._position.y;
				this.first = false;
			}
			else{
				//移动触碰点
                let deltaY =  this.lastPosition.y - touch._position.y;
				let deltaX = touch._position.x - this.lastPosition.x;
				this.lastPosition.x = touch._position.x;
				this.lastPosition.y = touch._position.y;
				//根据移动的距离进行旋转
				this.rotate.setValue(1 * deltaY /2, 1 * deltaX / 2, 0);
				mod.transform.rotate(this.rotate,false,false);
			}
		}
		else if (2 === touchCount){
			this.isTwoTouch = true;
			//获取两个触碰点
			let touch = this.scene.input.getTouch(0);
			let touch2 = this.scene.input.getTouch(1);
			//是否为新一次触碰,并未发生移动
			if (this.twoFirst){
				//获取触碰点的位置
				this.disFirstTouch.x = touch.position.x - touch2.position.x;
				this.disFirstTouch.y = touch.position.y - touch2.position.y;
				this.distance = Laya.Vector2.scalarLength(this.disFirstTouch);// 计算标量长度
				// console.log('First Distance',this.distance);
				this.sprite3DSacle = mod.transform.scale;

				this.touchAFirstX = touch.position.x;
				this.touchAFirstY = touch.position.y;
				this.touchBFirstX = touch2.position.x;
				this.touchBFirstY = touch2.position.y;

				this.twoFirst = false;
			}
			else{
				// 缩放
				this.disLastTouch.x = touch.position.x - touch2.position.x;
				this.disLastTouch.y = touch.position.y - touch2.position.y;
				let distance2 = Laya.Vector2.scalarLength(this.disLastTouch);
				//根据移动的距离进行缩放
				let factor =  0.001 * (distance2 - this.distance);
				this.sprite3DSacle.x += factor;
				this.sprite3DSacle.y += factor;
				this.sprite3DSacle.z += factor;
				this.ctrolScale();
				mod.transform.scale = this.sprite3DSacle;
				this.distance = distance2;

				// 移动
				this.touchALastX = touch.position.x;
				this.touchALastY = touch.position.y;
				this.touchBLastX = touch2.position.x;
				this.touchBLastY = touch2.position.y;

				let centerFirst = new Laya.Point((this.touchAFirstX + this.touchBFirstX) / 2, (this.touchAFirstY + this.touchBFirstY) / 2); 
				let centerLast = new Laya.Point((this.touchALastX + this.touchBLastX) / 2, (this.touchALastY + this.touchBLastY) / 2);

				let moveX = (centerFirst.x - centerLast.x)
				let moveY = (centerFirst.y - centerLast.y);
				mod.transform.translate(new Laya.Vector3(moveX,moveY,0),false);

				this.touchAFirstX = touch.position.x;
				this.touchAFirstY = touch.position.y;
				this.touchBFirstX = touch2.position.x;
				this.touchBFirstY = touch2.position.y;
			}	
		}
		else if (0 === touchCount){
			this.first = true;
			this.twoFirst = true;
			this.lastPosition.x = 0;
			this.lastPosition.y = 0;
			this.isTwoTouch = false;
		}
	}

	ctrolScale(){
        this.sprite3DSacle.x = this.sprite3DSacle.x < 0.75 ? 0.75 : (this.sprite3DSacle.x > 2.5 ? 2.5 : this.sprite3DSacle.x);
        this.sprite3DSacle.y = this.sprite3DSacle.y < 0.75 ? 0.75 : (this.sprite3DSacle.y > 2.5 ? 2.5 : this.sprite3DSacle.y);
        this.sprite3DSacle.z = this.sprite3DSacle.z < 0.75 ? 0.75 : (this.sprite3DSacle.z > 2.5 ? 2.5 : this.sprite3DSacle.z);
	}

    /**
     * 鼠标弹起时执行
     */
	onMouseUp() {	
		if (this.clicked == 1) {
			this.clicked++;
			// 单击事件 模型停止自动旋转
			this.modelRotate = false;
		} else if (this.clicked ==  2) {
			this.clickedTime.timeA = new Date();
			this.clicked++;
		} else if(this.clicked == 3) {
			this.clickedTime.timeB = new Date();
			let gap = Math.abs(this.clickedTime.timeA - this.clickedTime.timeB);
			if (gap < 400 && gap > 100){
				this.clicked = 1;
				// 双击事件 模型恢复初始角度和初始位置并重新开始自动旋转
				this.owner.transform.rotation = this.firstRotate;
				this.owner.transform.position = this.firstPosition;
				this.modelRotate = true;
			} else {
				this.clickedTime.timeA = new Date();
			}
		}
	}
}

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值