在XIB中动画按钮以编程方式移动

Question

我希望在视图加载时为XIB中的按钮设置动画以向上移动。使用下面的代码，按钮随动画移动，但它从新位置BACK移动到XIB中设置的原始位置。

感觉我错过了一些简单的东西，但我一直试图以不同的方式接近这个不成功的几个小时。这是因为我在自动布局的XIB中设置了动画？任何想法都表示赞赏。

// Relevant Part of XIB class
@IBDesignable class BottomNagivationBar: UIView {

    var view:UIView!

    //Buttons Outlet
    @IBOutlet weak var exploreIcon: UIButton!
}



override func viewDidLoad() {
    super.viewDidLoad()

UIView.animate(withDuration: 2, delay: 1, options: .allowUserInteraction, animations: {

        let position: CGFloat = 10
        let x:CGFloat = self.BottomNavigationBar.exploreIcon.frame.origin.x
        let y:CGFloat = self.BottomNavigationBar.exploreIcon.frame.origin.y + position

        self.BottomNavigationBar.exploreIcon.frame = CGRect(x: x, y: y, width: self.BottomNavigationBar.exploreIcon.frame.width, height: self.BottomNavigationBar.exploreIcon.frame.height) 

    })
}

Answer 1

这是因为我在自动布局的XIB中设置了动画？

是。动画和自动布局是敌人。您为位置设置动画，然后布局出现并应用您的约束，这些约束仍指定按钮的起始位置 - 因此它会跳回。

Answer 2

鉴于您要使用自动布局，您可能需要考虑使用CGAffineTransform为位置设置动画。加载视图后，您可以使用以下命令设置动画：

UIView.animate(withDuration: 2, delay: 1, options: .allowUserInteraction, animations: {

        self.exploreIcon.transform = CGAffineTransform(translationX: 0, y: 10.0)

})

如上所述，您还需要将动画从viewDidLoad移动到另一个函数，例如viewWillAppear。 viewDidLoad对于动画来说太早了，因为您的应用可能仍在启动/加载视图，并且您的动画可能不可见。