代码之家  ›  专栏  ›  技术社区  ›  RameshVel

将视图从原点旋转到另一个视图

  •  1
  • RameshVel  · 技术社区  · 6 年前

    我试图将一个视图旋转到另一个视图中心点(记住不要绕着它转,它是朝着的)。

    假设我有两个这样的视图

    enter image description here

    现在我想旋转俯视图来指向这样的俯视图

    enter image description here

    所以这就是我所做的

    • 计算第一个视图原点和底部视图中心之间的角度
    • 并将计算出的变换应用于俯视图。

      低于我使用的代码

      let rect = CGRect(x: 70, y: 200, width: 300, height: 100)
      let rectView = UIView(frame: rect)
      rectView.layer.borderColor = UIColor.green.cgColor;
      rectView.layer.borderWidth = 2;
      
      let endView = UIView(frame: CGRect(x: 250, y: 450, width: 70, height: 70))
      endView.layer.borderColor = UIColor.green.cgColor;
      endView.layer.borderWidth = 2;
      let end = endView.center;
      
      self.view.addSubview(endView)
      self.view.addSubview(rectView!)
      rectView.setAnchorPoint(CGPoint.zero)
      
      let angle = rectView.bounds.origin.angle(to: end);
      UIView.animate(withDuration: 3) {
          rectView.transform = rectView.transform.rotated(by: angle)
      }   
      

    我用这个分机 Get angle from 2 positions 计算两点之间的角度

    extension CGPoint {
      func angle(to comparisonPoint: CGPoint) -> CGFloat {
        let originX = comparisonPoint.x - self.x
        let originY = comparisonPoint.y - self.y
        let bearingRadians = atan2f(Float(originY), Float(originX))
        var bearingDegrees = CGFloat(bearingRadians).degrees
        while bearingDegrees < 0 {
            bearingDegrees += 360
        }
        return bearingDegrees
      }
    }
    
    extension CGFloat {
        var degrees: CGFloat {
            return self * CGFloat(180.0 / M_PI)
        }
    }
    
    extension UIView {
        func setAnchorPoint(_ point: CGPoint) {
            var newPoint = CGPoint(x: bounds.size.width * point.x, y: bounds.size.height * point.y)
            var oldPoint = CGPoint(x: bounds.size.width * layer.anchorPoint.x, y: bounds.size.height * layer.anchorPoint.y);
    
            newPoint = newPoint.applying(transform)
            oldPoint = oldPoint.applying(transform)
    
            var position = layer.position
    
            position.x -= oldPoint.x
            position.x += newPoint.x
    
            position.y -= oldPoint.y
            position.y += newPoint.y
    
            layer.position = position
            layer.anchorPoint = point
        }
    }
    

    enter image description here

    我想这个问题和角度是怎么计算的有关,但我不知道是什么?

    任何帮助都非常感谢。

    1 回复  |  直到 6 年前
        1
  •  2
  •   vacawama    6 年前

    角度必须是弧度

    旋转角度需要以弧度指定:

    rectView.transform = rectView.transform.rotated(by: angle)
    

    致:

    rectView.transform = rectView.transform.rotated(by: angle / 180.0 * .pi)
    

    angle(to:) 方法返回弧度而不是度数。


    使用 frame 而不是 bounds

    框架 rectView 计算角度时。这个 界限 (0, 0) . 你想要的 框架

    更改:

    let angle = rectView.bounds.origin.angle(to: end)
    

    let angle = rectView.frame.origin.angle(to: end)
    

    注: anchorPoint 矩形视图 矩形视图 endView . 解决这个问题的方法之一就是 锚定点 到的左边缘的中心 然后用这个点来计算 angle .