首页 > 解决方案 > 使用自动布局为 UIView 高度设置动画

问题描述

我想问一下如何使用autolayout. 我点击它时的第一个视图展开但第二个和第三个视图没有展开。即使我尝试打印它仍然没有打印这是我的代码。

这是我的设置xib,将middleContainerbottomContainer优先级设置为低。并且有topConstraint常数middleContainerbottomContainer25

在此处输入图像描述

@IBOutlet weak var topContainerHeightConstraint: NSLayoutConstraint!
    @IBOutlet weak var middleContainerHeightConstraint: NSLayoutConstraint!

    @IBOutlet weak var bottomContainerHeightConstraint: NSLayoutConstraint!
    @IBOutlet weak var tableViewMiddleConstraint: NSLayoutConstraint!
    @IBOutlet weak var tableViewBottomConstraint: NSLayoutConstraint!

    override func awakeFromNib() {
        super.awakeFromNib()

        calendarView.alpha = 0
        let topTapGesture = UITapGestureRecognizer(target: self, action: #selector(handleTopTap))
        let middleTapGesture = UITapGestureRecognizer(target: self, action: #selector(handleMiddleTap))
        let bottomTapGesture = UITapGestureRecognizer(target: self, action: #selector(handlebottomTap))
        topContainer.addGestureRecognizer(topTapGesture)
        middleContainer.addGestureRecognizer(middleTapGesture)
        bottomContainer.addGestureRecognizer(bottomTapGesture)
    }

    @objc func handleTopTap(gesture: UITapGestureRecognizer) {
//        print("Tapped")
        if topContainerHeightConstraint.constant == 75 {
            UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
                self.arrowImageView.image = #imageLiteral(resourceName: "up-chevron")
                self.topContainerHeightConstraint.constant = 350
                self.calendarView.alpha = 1
            })
        } else {
            defaultConstraint()
        }
    }

    @objc func handleMiddleTap(gesture: UITapGestureRecognizer) {
        print("Tapped")
        if middleContainerHeightConstraint.constant == 75  {
            UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
                self.arrowImageView.image = #imageLiteral(resourceName: "up-chevron")
                self.middleContainerHeightConstraint.constant = 110
                self.tableViewMiddleConstraint.constant = 110
            })
        } else {
            UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
                self.arrowImageView.image = #imageLiteral(resourceName: "up-chevron")
                self.middleContainerHeightConstraint.constant = 75
                self.tableViewMiddleConstraint.constant = 0
            })
        }
    }

    @objc func handlebottomTap(gesture: UITapGestureRecognizer) {
        if bottomContainerHeightConstraint.constant == 75 {
            UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
                self.arrowImageView.image = #imageLiteral(resourceName: "up-chevron")
                self.bottomContainerHeightConstraint.constant = 110
                self.tableViewBottomConstraint.constant = 162
            })
        } else {
            UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
                self.arrowImageView.image = #imageLiteral(resourceName: "up-chevron")
                self.bottomContainerHeightConstraint.constant = 75
                self.tableViewBottomConstraint.constant = 0
            })
        }
    }

    fileprivate func defaultConstraint() {
        UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: {
            self.arrowImageView.image = #imageLiteral(resourceName: "down-chevron")
            self.topContainerHeightConstraint.constant = 75
            self.calendarView.alpha = 0
            self.calendarView.layoutIfNeeded()
        })
    }

你能帮我在哪里做错了吗?

标签: swiftautolayout

解决方案


动画流程应该是这样的

self.topContainerHeightConstraint.constant = 75  // 1 change constant
UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 1, options: .curveEaseOut, animations: { 
    self.layoutIfNeeded() // 2 layout superView 
})

推荐阅读