iOS - 通过动画将搜索栏从中心移动到导航栏下方 (Swift)

iOS - Moving search bar from center to below Navigation Bar by animation (Swift)

我有一个搜索栏,它通过界面生成器添加到我的视图控制器的中心,我什至将它与 IBOutlet 连接起来。但是,我必须将搜索栏放在视图控制器的中央,因为它上面有重要信息。

我想要的是当点击搜索栏时,它应该动画到顶部,并固定在导航栏下方。我希望它位于顶部的原因是因为我需要更多 space 的结果 table 视图控制器来显示结果(点击搜索栏时会下降)。

我找遍了所有地方,但找不到任何关于如何修复导航栏下方搜索栏的信息。请帮忙!

P.S - 类似问题 link

首先,像下图一样添加你的约束:

如你所见,其中 2 个约束是用破折号绘制的,这些约束的优先级小于 1000,原因是我们希望垂直中心约束和顶部约束相互排斥:

  1. 将搜索栏锚定到视图的垂直中心。
  2. 将搜索栏锚定到视图顶部的方法。

并且因为我们希望搜索栏最初垂直居中,所以我们为该约束(约束编号 1)分配 999 的优先级,以及 [=40] 的优先级=]1到另一个。

您可以通过单击约束并在右侧的大小检查器中设置其优先级来设置优先级,如下图所示:

其次,将这两个约束和您的搜索栏连接到您的视图控制器:

@IBOutlet weak var searchBar: UISearchBar!  
@IBOutlet weak var searchBarAnchorToTopConstraint: NSLayoutConstraint!
@IBOutlet weak var searchBarCenterVerticallyConstraint: NSLayoutConstraint!

第三,使您的视图控制器符合UISearchBarDelegate协议并将其设置为搜索栏的代理。

第四,按以下方式实现searchBarTextDidBeginEditing方法:

func searchBarTextDidBeginEditing(_ searchBar: UISearchBar) {

    self.searchBarCenterVerticallyConstraint.priority = 1
    self.searchBarAnchorToTopConstraint.priority = 999

    UIView.animate(withDuration: 1, delay: 0, options: [.curveEaseOut], animations: {

        self.view.layoutIfNeeded()

        }, completion: nil)
}

我们在这里所做的只是给 searchBarCenterVerticallyConstraint 低优先级和 searchBarAnchorToTopConstraint 高优先级(我们调换了它们的优先级)。

希望对您有所帮助!