如何计算缩放图像的偏移量？

Question

当用户按下按钮时，我会在图像上使用“动画”来以编程方式缩放图像。

  handleZoomIn() {
    this.zoom += -0.25;
    Animated.spring(this.animatedValue, {
      toValue: this.zoom
    }).start()   }

  handleZoomOut() {
    this.zoom += 0.25;
    Animated.spring(this.animatedValue, {
      toValue: this.zoom,
      friction: 3,
      tension: 40
    }).start()   }
    const imageStyle = {
      transform: [{ scale: this.animatedValue}]
    } 

   render() {
      <Animated.Image source={{ uri: source }} style={[imgSize, { position: 'absolute' }, imageStyle]} />
   }

有一个图像和一个缩放图像。

如何计算两个图像的左上角之间的距离？

偏移量不是吗？

（dx，dy）=（（ori​​ginalWidth-（originalWidth X scale））/ 2，（originalWidth-（originalHeight X scale））/ 2）

Answer 1

  

（dx，dy）=（（ori​​ginalWidth-（originalWidth X scale））/ 2，（originalWidth-（originalHeight X scale））/ 2）

基本上是，但是您也有复制/粘贴错字，也使用高度“ width”，即：（dx，dy）=（（ori​​ginalWidth-（originalWidth * scale））/ 2，（originalHeight-（originalHeight * scale） ））/ 2）

在经典的过程代码中，可以稍微简化一下（可能是个人偏见），例如：

offsetFactor = (1.0 - scale) / 2;
dx = originalWidth * offsetFactor;
dy = originalHeight * offsetFactor;

  

如何计算两个图像的左上角之间的距离？

哦，但是您的问题是关于距离的。.那当然是d = sqrt((dx*dx) + (dy*dy));……但是程序员有一半的时间需要这个距离，例如平方距离（d_sq = (dx*dx) + (dy*dy);）就足够了用于排序或检查某物是否在半径之内（然后将其与半径的平方值进行比较），等等。这样可以避免根计算，如果涉及到很多值，这通常是主要的优化。 （其中一种不起作用的情况是3D中的灯光阴影模型，这使“ phong阴影”成为早期3D渲染器相当昂贵的功能，因为您无法避免那里至少每个像素的根计算不准确）