動畫視圖跳轉到最終位置而不是慢速運動

Question

我正在對包含ImageView和標籤的視圖進行動畫處理。 請參閱圖1.我正在下圖tableView的滾動時嘗試動畫​​upperView。最終的結果應該如圖2所示。其中imageView的高度和寬度都減小了，並且在左側角落處，imageView前面有最小高度和標籤。動畫工作正常，imageView順利地從原始位置移動到最終位置，標籤也一樣。但是，upperView並不像每個動畫一樣工作。

我試着用upperViews Height Constraint和它的框架。

1. 如果我改變它的高度約束，它會很快進入最終位置。

2. 如果我給高度使用upperView.frame.size.height然後視圖上升，但表視圖仍然在他們的地方。

這是我曾嘗試

func scrollViewDidScroll(scrollView: UIScrollView) { 
    if scrollView.contentOffset.y > 0 
     { 
     UIView.animateWithDuration(1.5, delay: 0.0, options: .CurveEaseOut, animations: 
        { 
         self.imageView.frame = CGRect(x: 5.0, y: 0.0, width: 30, height: 40) 

        }, completion: { finished in 
         UIView.animateWithDuration(1.5, delay: 1.0, options: UIViewAnimationOptions.AllowUserInteraction,animations: { 

          self.selectedProgramNameLabel.center = CGPoint(x: self.selectedProgramNameLabel.center.x, y: self.imageView.center.y) 

          }, completion: { finished in 
           UIView.animateWithDuration(1.5, delay: 2.0, options: UIViewAnimationOptions.AllowUserInteraction, animations: { 

           self.upperViewHeightConstraint.constant = 50 

            }, completion: { finished in 

           }) 
         }) 
       }) 
     } 
     else if scrollView.contentOffset.y == 0 
     { 
      UIView.animateWithDuration(1.5, delay: 0.0, options: .CurveEaseOut, animations: 
       { 
        self.selectedProgramNameLabel.center = CGPoint(x: self.selectedProgramNameLabel.center.x, y: self.imageView.center.y + self.imageView.frame.height - 45) 


       }, completion: { finished in 
        UIView.animateWithDuration(1.5, delay: 0.0, options: UIViewAnimationOptions.AllowUserInteraction,animations: { 

         self.imageView.frame = CGRect(x: self.upperView.frame.origin.x, y: self.upperView.frame.origin.y, width: 100.0, height: 134) 


         }, completion: { finished in 
          UIView.animateWithDuration(1.5, delay: 1.0, options: UIViewAnimationOptions.AllowUserInteraction, animations: { 


           }, completion: { finished in 


          }) 
        }) 
      }) 

     } 

TIA。

圖1. 圖2.

Answer 1

雖然動畫任何佈局約束，它是必須的，以動畫塊使用layoutIfNeeded，如果你想期望的動畫效果。所以只需在動畫塊中添加這個。

self.view.layoutIfNeeded() 
self.upperViewHeightConstraint.constant = 50 

還可以使用任何標誌來檢查視圖是否已經動畫，否則您的動畫塊將執行次數。

Answer 2

嘗試使用：UIViewAnimationOptions.beginFromCurrentState，CABasicAnimation。 How to animate the frame of an layer with CABasicAnimation?

這不是你在找什麼，但我希望能幫助你。

var cntTopViewT: NSLayoutConstraint! 
var cntTopViewH: NSLayoutConstraint! 

override func viewDidLoad() { 
    super.viewDidLoad() 

    navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default) 
    navigationController?.navigationBar.shadowImage = UIImage() 
    navigationController?.navigationBar.isTranslucent = true 

    let scrollView = UIScrollView() 
    scrollView.delegate = self 
    scrollView.translatesAutoresizingMaskIntoConstraints = false 
    view.addSubview(scrollView) 

    let topView = UIView() 
    topView.translatesAutoresizingMaskIntoConstraints = false 
    scrollView.addSubview(topView) 

    let topViewBackgroundImageView = UIImageView() 
    topViewBackgroundImageView.translatesAutoresizingMaskIntoConstraints = false 
    topView.addSubview(topViewBackgroundImageView) 

    let bottomView = UIView() 
    bottomView.translatesAutoresizingMaskIntoConstraints = false 
    scrollView.insertSubview(bottomView, at: 0) 

    let v = UIView() 
    v.translatesAutoresizingMaskIntoConstraints = false 
    bottomView.addSubview(v) 


    let views: [String: Any] = ["view": view, 
           "scrollView": scrollView, 
           "topView": topView, 
           "topViewBackgroundImageView": topViewBackgroundImageView, 
           "bottomView": bottomView, 
           "v": v] 
    var cnts: [NSLayoutConstraint] = [] 

    cnts += NSLayoutConstraint.constraints(withVisualFormat: "H:|[scrollView]|", options: [], metrics: nil, views: views) 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:|[scrollView]|", options: [], metrics: nil, views: views) 

    cnts += NSLayoutConstraint.constraints(withVisualFormat: "H:[topView(scrollView)]", options: [], metrics: nil, views: views) 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:[scrollView]-0@1-[topView]", options: [.alignAllCenterX], metrics: nil, views: views) 
    cntTopViewT = NSLayoutConstraint(item: topView, attribute: .top, relatedBy: .equal, toItem: scrollView, attribute: .top, multiplier: 1, constant: 0) 
    cntTopViewH = NSLayoutConstraint(item: topView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1, constant: 0) 
    cnts += [cntTopViewT, cntTopViewH] 

    cnts += NSLayoutConstraint.constraints(withVisualFormat: "H:|[topViewBackgroundImageView]|", options: [], metrics: nil, views: views) 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:|[topViewBackgroundImageView]|", options: [], metrics: nil, views: views) 

    cnts += [NSLayoutConstraint(item: bottomView, attribute: .width, relatedBy: .equal, toItem: scrollView, attribute: .width, multiplier: 0.9, constant: 0)] 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:[scrollView]-0@1-[bottomView]|", options: [.alignAllCenterX], metrics: nil, views: views) 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:|[bottomView(999)]|", options: [], metrics: nil, views: views) 

    cnts += NSLayoutConstraint.constraints(withVisualFormat: "H:|[v(50)]", options: [], metrics: nil, views: views) 
    cnts += NSLayoutConstraint.constraints(withVisualFormat: "V:|[v(50)]", options: [], metrics: nil, views: views) 

    NSLayoutConstraint.activate(cnts) 

    topView.backgroundColor = .red 
    bottomView.backgroundColor = .green 
    v.backgroundColor = .blue 
} 

func scrollViewDidScroll(_ scrollView: UIScrollView) { 
    let minH = (navigationController?.navigationBar.frame.height ?? 0) + UIApplication.shared.statusBarFrame.height 
    let maxH = view.frame.height * 0.35 

    cntTopViewT.constant = scrollView.contentOffset.y 
    cntTopViewH.constant = max(-scrollView.contentOffset.y, minH) 
    scrollView.contentInset.top = maxH 
    scrollView.scrollIndicatorInsets.top = (cntTopViewH.constant - minH) + (minH * ((cntTopViewH.constant - minH)/(maxH - minH))) + 5 

    //let kTransform = min(max(cntTopViewH.constant/maxH + 0.1, 0.5), 1) 
    //topViewFioLabel.transform = CGAffineTransform(a: kTransform, b: 0, c: 0, d: kTransform, tx: 0, ty: 0) 
}