首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在先前转换的UIView上正确地为转换设置动画

如何在先前转换的UIView上正确地为转换设置动画
EN

Stack Overflow用户
提问于 2019-03-01 06:46:53
回答 2查看 240关注 0票数 2

问题的摘要

无法在已翻译的 UIView**.**上正确执行移动和缩放动画

当视图没有事先移动时,为了达到预期的效果,我首先应用scale,然后应用平移。我使用UIViewPropertyAnimator对结果转换进行动画处理:视图可以放大或缩小,同时相应地移动。

但是,如果在应用此动画转换之前视图已从其原始位置移动(平移),我无法实现在将视图从其新位置__移动时缩放的结果。

“虽然转换问题有很好的文档记录-而且我在提交问题之前已经做了尽职调查-但到目前为止我还没有找到一个成功的解决方案!

变换动画代码

为了便于理解和解决问题,对代码进行了简化。

代码语言:javascript
复制
extension UIView {

   func zoomAndMove(vector: CGPoint, scale: CGPoint){
      self.transform = self.transform.concatenating(CGAffineTransform(scaleX: scale.x, y: scale.y).concatenating(CGAffineTransform(translationX: vector.x, y: vector.y))
   }


   func animateZoomAndMove(from origin: CGPoint, for duration: TimeInterval, cameraZoom: CGPoint, timingFunction: UITimingCurveProvider, controlPoint2: CGPoint(x: 0.8, y: 0.7)) autoplay: Bool = false) -> UIViewPropertyAnimator {
      let animator = UIViewPropertyAnimator(duration: duration, timingParameters: timingFunction)
      let vector = CGPoint(x: self.frame.midX - origin.x, y: self.frame.midY - origin.y)

      animator.addAnimations {
         self.zoomAndMove(vector: vector, scale: cameraZoom)
      }

      if autoplay { animator.startAnimation()}
      return animator
   }
}

到目前为止的尝试

我已经尝试修改我的代码以返回一个转换,该转换在zoomAndMove发生之前考虑了先前的转换:

代码语言:javascript
复制
extension UIView {

   func zoomAndMove(vector: CGPoint, scale: CGPoint){

      if self.transform == CGAffineTransform.identity {
          self.transform = self.transform.concatenating(CGAffineTransform(scaleX: scale.x, y: scale.y).concatenating(CGAffineTransform(translationX: vector.x, y: vector.y)) 
      } else {
          let preTransform = self.transform
          self.transform = CGAffineTransform(a: scale.x, b: 0, c: 0, d: scale.y, tx: vector.x + preTransform.tx, ty: vector.y + preTransform.ty)
      }
   }

此代码不会产生所需的效果:视图将跳转到新位置,正确缩放并“随机”移动。

我肯定遗漏了一些东西--我可能瞄准了错误的最终结果矩阵--但总而言之,我现在卡住了。

如果有人知道如何执行像缩放和从已经翻译的UIView中移动UIView这样简单的任务,我将非常感谢他们的意见!

最好的

编辑

一张图片可以胜过1000个单词,所以当我尝试实现到目前为止提出的各种建议(特别是.scaledBy(:)方法)时,会发生以下情况:

您可以注意到,最终的转换是正确的,但动画却不正确。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-03-01 19:19:18

首先,感谢@gmogames花时间提供建议。能够交流思想总是很有帮助的!

这个问题确实与在应用新转换之前重置视图的anchorPoint (或中心)有关,以便动画正确运行。因此,使用一个简单得多的示例,在将视图移动到之后对其进行缩放,下面是新方法的外观:

代码语言:javascript
复制
extension UIView {
    func scaleView(scaleFactor: CGPoint, duration: TimeInterval) {
        // store the view original center
        let oCenter = self.center

        // get the current transformation
        let cTransform = self.transform

        // set the new center of the view 
        self.center = CGPoint(x: self.frame.midX, y: self.frame.midY)

        // clears the transform matrix from potential prior translation
        // Note that you need to take into account potential prior scale of the view into the translation vector!!
        self.transform = self.transform.translatedBy(x: -cTransform.tx / cTransform.a, y: -cTransform.ty / cTransform.d)


        // Animates the transformation
        let animator = UIViewPropertyAnimator(duration: duration, timingParameters: UICubicTimingParameters(controlPoint1: CGPoint(x: 0, y: 0), controlPoint2: CGPoint(x: 1, y: 1))
        animator.addAnimations {
            self.transform = self.transform.scaledBy(x: scaleFactor.x, y: scaleFactor.y)
        }
        // resets the View to its original center and apply the transformation so that the view stays in the right end position
        animator.addCompletion { (position) in
            if position == UIViewAnimatingPosition.end {
                self.center = oCenter
                self.transform = cTransform.scaledBy(x: scaleFactor.x, y: scaleFactor.y)
            }
        }
        animator.startAnimation()
    }
}

这里的动画效果是:移动+缩放+缩放+还原为原始

票数 0
EN

Stack Overflow用户

发布于 2019-03-01 12:06:51

您是否尝试过将当前转换分配给某个属性,然后修改此复制的属性,然后重新分配给视图?类似于:

代码语言:javascript
复制
let originalTransform = view.transform
let scaledTransform = originalTransform.scaledBy(x: 0.2, y: 0.2)
view.transform = scaledTransform

我已经用这种方法创建了一个按钮的动画,它确实工作得很好,但我不确定这是你想要的。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54935477

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档