NavigationBar中的iOS 11 SearchBar [英] iOS 11 SearchBar in NavigationBar

问题描述

在iOS 11上，Apple通过使拐角变圆并且高度变大来重新设计了UISearchBar.将UISearchBar添加到navigationBar非常简单，只需使用 navigationItem.titleView = searchBar 将其设置为navigationItem的titleView.

With iOS 11 Apple has redesigned the UISearchBar by making the corners rounder and the height bigger. Adding a UISearchBar to the navigationBar is pretty simple by just setting it as the titleView of the navigationItem using navigationItem.titleView = searchBar.

但是，在iOS 11中，它似乎不再能正常工作.看看我们使用iOS 10和iOS 11比较相同设置的屏幕

However, in iOS 11 it does not seem to work anymore as expected. Have a look at the screens where we compare the same setup using iOS 10 and iOS 11

iOS 10

iOS 11

您可以清楚地看到SearchBar增大了NavigationBar的大小，但是条形按钮没有正确对齐.而且searchBar不再使用左侧的可用空间.

You can clearly see that the SearchBar increases the size of the NavigationBar but the bar buttons do not get aligned correctly. Also the searchBar does not use the available space on the left anymore.

将searchBar放入包装视图中，以获取iPad上的取消"按钮，如此处所述

Putting the searchBar into a wrapper view to get the cancel button on iPad as described here Cancel button is not shown in UISearchBar also does not seem work anymore since the searchBar is then not visible at all.

如果有人遇到类似问题或已经知道如何解决/改进此问题，我将非常感激.

If anyone has similar issues or already knowns how to fix/improve this I would be very thankful.

这是使用Xcode 9 Beta 4构建的.也许将来的版本会解决此问题.

This was built using Xcode 9 Beta 4. Maybe future releases will fix this issue.

更新:

由于此问题尚未解决，因此我们决定使用以下解决方案.我们在NavBar中添加了一个新的UIBarButtonItem，然后提供了一个新的ViewController，我们只在其中放置了searchBar，而在NavBar中什么也没用，这似乎可行.使用选择的答案可能是最好的解决方案，因为具有iOS 11的Apple希望我们使用此新设计，即使它没有给我们带来我们最初想要的结果.解决此问题的另一种方法可能是自定义SearchBar，但这是另一个主题.

Since this does not get fixed we decided to use following solution. We added a new UIBarButtonItem to the NavBar which then presents a new ViewController where we only put a searchBar and nothing else into the NavBar which seems to work. Using the selected answer may be the best solution since Apple with iOS 11 wants us to use this new design even if it does not give us the result we originally wanted. Another way to possible solve this could be a custom SearchBar but this is another topic.

推荐答案

iOS 11中NavigationItem上有一个新的searchController属性.

There's a new searchController property on navigationItem in iOS 11.

https://developer.apple.com/documentation/uikit/uinavigationitem/2897305-searchcontroller

像这样使用...

if #available(iOS 11.0, *) {
     navigationItem.searchController = searchController
} else {
     // Fallback on earlier versions
     navigationItem.titleView = searchController?.searchBar
}

在Objective-C中，if语句如下:

In Objective-C the if statement looks like this:

if (@available(iOS 11.0, *)) {

在iOS 11上，如果您未设置 navigationItem.hidesSearchBarWhenScrolling = false ，则除非用户向下滚动以显示它，否则搜索栏最初可能是隐藏的.如果确实将其设置为false，则它会显示在标题将要显示的下方，而无需用户滚动.

On iOS 11, if you don't set navigationItem.hidesSearchBarWhenScrolling = false, the search bar may initially be hidden, unless the user scrolls down to reveal it. If you do set it to false, it appears stacked below where the title would go without the user having to scroll.

这篇关于NavigationBar中的iOS 11 SearchBar的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！