目前movable-view缩放原点一直是中心,导致缩放后中心点不能达到预期,希望transform-origin可以自己配置。
今天弄了一天缩放后的中心点,计算后中心点总是不能达到预期,最后还是放弃用这个原生组件自己用touchmove重新写了一个组件
这是我在movable-view缩放后计算中心点位置的计算方式,只能计算到附近,而且是缩放后动画跳动到这个点而不是同步
let oldScale = this.oldScale;
let scale = e.detail.scale;
/*
原始宽高减去现在图片高度除以2,即为当前图片左上角坐标
*/
let left = (this.imgW*scale - this.imgW)/2;
let top = (this.imgH*scale - this.imgH)/2;
/*
缩放之前图片左上角坐标
*/
let oldLeft = (this.imgW*oldScale - this.imgW)/2;
let oldTop = (this.imgH*oldScale - this.imgH)/2;
// 缩放之前左上角在图片中的位置
let x = this.imgX - oldLeft;
let y = this.imgY - oldTop;
/* 缩放中心点 */
let imgX = this.windowWidth/2;
let imgY = this.windowHeight/2;
this.centerX = (imgX - x)/oldScale; //中心点在原始图片中的坐标
this.centerY = (imgY - y)/oldScale; //中心点在原始图片中的坐标
imgX = -1*this.centerX*scale this.windowWidth/2;
imgY = -1*this.centerY*scale this.windowHeight/2;
this.imgX = Number(imgX) Number(left);
this.imgY = Number(imgY) Number(top);
console.log(left,top)
console.log(this.imgX,this.imgY)
this.scaleValue = scale;
this.oldScale = scale;
0 个回复