为什么更新自动布局约束时我的 UIView 无法正确显示？

Question

我正在尝试为一个简单的自动布局约束更改设置动画，但是当我第一次调用它时它会设置动画，而不是仅仅拉伸和更改高度，它会向上移动整个视图，如果我再次调用它，它会自行修复.

这是我设置约束的方式：

hiddenView.addSubview(topView)
                    topView.translatesAutoresizingMaskIntoConstraints = false
                    topView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true

            topView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
            topView.bottomAnchor.constraint(equalTo: hiddenView.bottomAnchor).isActive = true

            topViewDefaultTopAnchorConstraints.append(topView.topAnchor.constraint(equalTo: hiddenView.centerYAnchor))
            topViewSelectedTopAnchorConstraints.append(topView.topAnchor.constraint(equalTo: hiddenView.topAnchor))

            NSLayoutConstraint.activate(topViewDefaultTopAnchorConstraints)

这是我更新它们的方式：

func showTopView() {
    NSLayoutConstraint.deactivate(topViewDefaultTopAnchorConstraints)
    NSLayoutConstraint.activate(topViewSelectedTopAnchorConstraints)
    UIView.animate(withDuration: 0.25) {
        self.view.layoutIfNeeded()
    }
}

更新： 这是调用 showTopView 时发生的情况的 gif 图像，再次调用它会修复底部约束：

它应该只是像第二张图片那样动画，而不是把整个视图都向上，因为 bottomAnchor 没有改变，我该如何解决这个问题？

更新：我意识到我正在圆角 topView 和 bottomView，如果我不圆角，那么它可以正常工作，所以它与此有关。

override func viewDidLayoutSubviews() {
    topView.roundCorners(corners: [.topLeft, .topRight], radius: 100*ScreenDimensions.ASPECT_RATIO_RESPECT_OF_XMAX)
    bottomView.roundCorners(corners: [.topLeft, .topRight], radius: 100*ScreenDimensions.ASPECT_RATIO_RESPECT_OF_XMAX)
    topConstraint = topView.topAnchor.constraint(equalTo: hiddenView.topAnchor, constant: hiddenView.frame.height/2)
    topConstraint.isActive = true
}

Answer 1

似乎hiddenView 的bottomAnchor 与topView 的底部一起被拉高了。确保hiddenView 的bottomAnchor 被正确约束。更好的方法是提供一个heightAnchor 并增加 heightConstraint 常量值以动画视图以增加高度。

Answer 2

我想我知道你的问题是什么。您可能需要使用常量，而不是定义两个不同的约束来激活/停用。

• 首先，在 ViewController 的顶部定义一个约束，如下所示：

var topConstraint: NSLayoutConstraint!

• 然后，如下所示进行初始化：

    hiddenView.addSubview(topView)
    topView.translatesAutoresizingMaskIntoConstraints = false
    topView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
  
    topView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
    topView.bottomAnchor.constraint(equalTo: hiddenView.bottomAnchor).isActive = true
    topConstraint = topView.topAnchor.constraint(equalTo: hiddenView.topAnchor, constant: hiddenView.frame.height/2)
    topConstraint.isActive = true            
  

• 然后在 showTopView 中，您只需要更新常量即可创建您正在寻找的动画：

    func showTopView() {
        topConstraint.isActive = false            
        topConstraint.constant = 0
        topConstraint.isActive = true            
        UIView.animate(withDuration: 0.25) {
            self.view.layoutIfNeeded()
        }
    }

同样，如果你想让视图恢复正常，你可以按如下方式实现：

    func hideTopView() {
        topConstraint.isActive = false            
        topConstraint.constant = hiddenView.frame.height/2
        topConstraint.isActive = true            
        UIView.animate(withDuration: 0.25) {
            self.view.layoutIfNeeded()
        }
    }

Answer 3

这种方法可能会让你的运气更好：

override func viewDidLayoutSubviews() {

    super.viewDidLayoutSubviews()

    let r = 100*ScreenDimensions.ASPECT_RATIO_RESPECT_OF_XMAX

    topView.layer.cornerRadius = r
    topView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]

    bottomView.layer.cornerRadius = r
    bottomView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]

}