我的UISearchBar 是导航栏的一部分，例如：
let searchBar = UISearchBar()
//some more configuration to the search bar
.....
navigationItem.titleView = searchBar
更新到iOS 11 后，我的应用中的搜索栏发生了一些奇怪的事情。在iOS 10 之前，我的导航栏看起来像：
现在iOS 11 我有：
如您所见，两个搜索栏的四舍五入有所不同，这并不困扰我。问题是搜索栏增加了导航栏的高度。所以当我转到另一个控制器时，它看起来也很奇怪：
事实上，奇怪的黑线高度加上当前导航栏的高度，就等于第二张图中导航栏的高度……
任何想法如何摆脱黑线并在所有视图控制器中保持一致的导航栏高度？
【问题讨论】：
标签： ios swift uinavigationbar ios11
您可以在 iOS 11 的搜索栏中添加高度 44 的约束。
// 斯威夫特
if #available(iOS 11.0, *) {
searchBar.heightAnchor.constraint(equalToConstant: 44).isActive = true
}
// 目标-C
if (@available(iOS 11.0, *)) {
[searchBar.heightAnchor constraintEqualToConstant:44].active = YES;
}
【讨论】：
这也发生在我身上，在 iOS 12.4 中运行良好，在 13 以上版本中变得很奇怪。 问题在于 iOS 13 导航栏高度从实现 searchBar 的 UIViewController 跳转后从 88 增加到 100。
在实现 searchBar 的 UIViewController 中试试这个。
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.view.setNeedsLayout()
navigationController?.view.layoutIfNeeded()
}
修复后预览：
修复前预览：
【讨论】：
iOS 11 中带有 SearchBar 的 NavigationBar 下出现黑线，分两种情况：
我的解决方案是：使用 UISearchBar 将此代码添加到我的 ViewController：
-(void)viewWillDisappear:(BOOL)animated{
[super viewWillDisappear:animated];
[self.navigationController.view setNeedsLayout]; // force update layout
[self.navigationController.view layoutIfNeeded]; // to fix height of the navigation bar
}
Swift 4 更新
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.view.setNeedsLayout() // force update layout
navigationController?.view.layoutIfNeeded() // to fix height of the navigation bar
}
【讨论】：
无法发表评论，但想分享一些我遇到的其他问题，即使在使用其他解决方案之一之后，我也花了很多时间试图弄清这个问题的根源。
看来对我来说最好的解决办法是Andrew's answer：
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.view.setNeedsLayout() // force update layout
navigationController?.view.layoutIfNeeded() // to fix height of the navigation bar
}
但是，至少 在 iOS 12.1 中，如果您的 UINavigationBar:
isTranslucent 设置为false，带有搜索栏的视图控制器在交互关闭时似乎无法调整其视图布局（通过后退按钮正常关闭似乎有效）。setBackgroundImage(UIImage(), for: .default)设置了背景图，过渡动画无法正常工作，完成后会跳回原位。这些特定的属性被设置为让导航栏以某种方式出现，所以我需要做一些调整来恢复它，或者忍受奇怪的行为。如果我遇到其他问题或找到其他解决方案或其他操作系统版本中的差异，将尝试记住更新上述内容。
【讨论】：
向使用UISearchController 并将其UISearchBar 附加到navigationItem.titleView 的用户致意。我花了疯狂的 4-5 个小时来解决这个问题。遵循 iOS 11+ 推荐的方法，将 searchController 放入 navigation.searchController 并不适合我的情况。有这个 searchController/searchBar 的屏幕有一个 backButton，一个自定义的。
我在 iOS 10、iOS 11 和 12 中对此进行了测试。在不同的设备上。我不得不这样做。不解决这个恶魔我就不能回家。鉴于时间紧迫，这是我今天能做的最完美的事情。
所以我只想分享我所做的这项辛勤工作，您可以将所有内容放在您想要的任何位置（例如 viewModel 中的变量）。就是这样：
在我的第一个屏幕（比如主屏幕，没有此搜索控制器）中，我的viewDidLoad() 中有这个。
self.extendedLayoutIncludesOpaqueBars = true
在我的第二个屏幕中，有 searchController 的那个，我的 viewDidAppear 中有这个。
覆盖 func viewDidAppear(_ animated: Bool) { super.viewDidAppear(动画)
let systemMajorVersion = ProcessInfo.processInfo.operatingSystemVersion.majorVersion
if systemMajorVersion < 12 {
// Place the search bar in the navigation item's title view.
self.navigationItem.titleView = self.searchController.searchBar
}
if systemMajorVersion >= 11 {
self.extendedLayoutIncludesOpaqueBars = true
UIView.animate(withDuration: 0.3) {
self.navigationController?.navigationBar.setNeedsLayout()
self.navigationController?.navigationBar.layoutIfNeeded()
}
self.tableView.contentInset = UIEdgeInsets(top: -40, left: 0, bottom: 0, right: 0)
if self.viewHadAppeared {
self.tableView.contentInset = .zero
}
}
self.viewHadAppeared = true // this is set to false by default.
}
这是我的 searchController 的声明：
lazy var searchController: UISearchController = {
let searchController = UISearchController(searchResultsController: nil)
searchController.hidesNavigationBarDuringPresentation = false
searchController.dimsBackgroundDuringPresentation = false
searchController.searchBar.textField?.backgroundColor = .lalaDarkWhiteColor
searchController.searchBar.textField?.tintColor = .lalaDarkGray
searchController.searchBar.backgroundColor = .white
return searchController
}()
所以我希望有一天这对某人有所帮助。
【讨论】：
谢谢大家！我终于找到了解决办法。
使用 UISearchBar 将以下代码添加到 ViewController。
viewDidLoad
-(void)viewDidLoad
{
[super viewDidLoad];
self.extendedLayoutIncludesOpaqueBars = YES;
...
}
override func viewDidLoad() {
super.viewDidLoad()
self.extendedLayoutIncludesOpaqueBars = true
}
viewWillDisappear
-(void)viewWillDisappear:(BOOL)animated{
[super viewWillDisappear:animated];
// force update layout
[self.navigationController.view setNeedsLayout];
// to fix height of the navigation bar
[self.navigationController.view layoutIfNeeded];
}
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
navigationController?.view.setNeedsLayout() // force update layout
navigationController?.view.layoutIfNeeded() // to fix height of the navigation bar
}
【讨论】：
我通过将约束添加到嵌入搜索栏的地图视图控制器上的 viewDidAppear 来解决此问题
public override func viewDidAppear(_ animated: Bool) {
if #available(iOS 11.0, *) {
resultSearchController?.searchBar.heightAnchor.constraint(equalToConstant: 44).isActive = true
// searchBar.heightAnchor.constraint(equalToConstant: 44).isActive = true
}
}
【讨论】：
就我而言，我必须将 textField 的高度降低 36pt -> 28pt。
所以我尝试改变框架的高度，图层的高度。但这些方法没有奏效。
最后，我找到了一个解决方案，那就是面具。 我认为，这不是一个好方法，但它确实有效。
let textField = searchBar.value(forKey: "searchField") as? UITextField
textField?.font = UIFont.systemFont(ofSize: 14.0, weight: .regular)
textField?.textColor = #colorLiteral(red: 0.1960784314, green: 0.1960784314, blue: 0.1960784314, alpha: 1)
textField?.textAlignment = .left
if #available(iOS 11, *) {
let radius: CGFloat = 5.0
let magnifyIconWidth: CGFloat = 16.0
let inset = UIEdgeInsets(top: 4.0, left: 0, bottom: 4.0, right: 0)
let path = CGMutablePath()
path.addArc(center: CGPoint(x: searchBar.bounds.size.width - radius - inset.right - magnifyIconWidth, y: inset.top + radius), radius: radius, startAngle: .pi * 3.0/2.0, endAngle: .pi*2.0, clockwise: false) // Right top
path.addArc(center: CGPoint(x: searchBar.bounds.size.width - radius - inset.right - magnifyIconWidth, y: searchBar.bounds.size.height - radius - inset.bottom), radius: radius, startAngle: 0, endAngle: .pi/2.0, clockwise: false) // Right Bottom
path.addArc(center: CGPoint(x: inset.left + radius, y: searchBar.bounds.size.height - radius - inset.bottom), radius: radius, startAngle: .pi/2.0, endAngle: .pi, clockwise: false) // Left Bottom
path.addArc(center: CGPoint(x: inset.left + radius, y: inset.top + radius), radius: radius, startAngle: .pi, endAngle: .pi * 3.0/2.0, clockwise: false) // Left top
let maskLayer = CAShapeLayer()
maskLayer.path = path
maskLayer.fillRule = kCAFillRuleEvenOdd
textField?.layer.mask = maskLayer
}
如果你想改变 textField 的框架，你可以改变 insets。
【讨论】：
我无法使用将导航栏保持在 44 的解决方案。 所以我花了一天的时间，但最后，我找到了一个不改变栏高度并将按钮放在栏中间的解决方案。问题是按钮放置在配置为水平堆栈视图的堆栈视图中，因此不会适应高度变化。
这是在初始化时完成的：
UIBarButtonItem *cancelButton;
if (@available(iOS 11.0, *)) {
// For iOS11 creating custom button to accomadate the change of navbar + search bar being 56 points
self.navBarCustomButton = [UIButton buttonWithType:UIButtonTypeCustom];
[self.navBarCustomButton setTitle:@"Cancel"];
[self.navBarCustomButton addTarget:self action:@selector(cancelButtonTapped) forControlEvents:UIControlEventTouchUpInside];
cancelButton = [[UIBarButtonItem alloc] initWithCustomView:self.navBarCustomButton];
} else {
cancelButton = [[UIBarButtonItem alloc] initWithTitle:MagicLocalizedString(@"button.cancel", @"Cancel")
style:UIBarButtonItemStylePlain
target:self
action:@selector(cancelButtonTapped)];
}
在 viewWillApear 上（或视图添加到导航堆栈后的任何时间）
if (@available(iOS 11.0, *)) {
UIView *buttonsStackView = [navigationController.navigationBar subviewOfClass:[UIStackView class]];
if (buttonsStackView ) {
[buttonsStackView.centerYAnchor constraintEqualToAnchor:navigationController.navigationBar.centerYAnchor].active = YES;
[self.navBarCustomButton.heightAnchor constraintEqualToAnchor:buttonsStackView.heightAnchor];
}
}
而 subviewOfClass 是 UIView 上的一个类别：
- (__kindof UIView *)subviewOfClass:(Class)targetClass {
// base case
if ([self isKindOfClass:targetClass]) {
return self;
}
// recursive
for (UIView *subview in self.subviews) {
UIView *dfsResult = [subview subviewOfClass:targetClass];
if (dfsResult) {
return dfsResult;
}
}
return nil;
}
【讨论】：
在“ACKNOWLEDGEMENTS”视图控制器上试试这个代码 在 viewDidLoad 中
self.extendedLayoutIncludesOpaqueBars = true
【讨论】：
extendedLayoutIncludesOpaqueBars 属性的作用，我将不胜感激。
我发现 Mai Mai 的解决方案是唯一真正可用的解决方案。
然而它仍然不完美：
旋转设备时，搜索栏未正确调整大小并保持较小的尺寸。
我已经找到了解决办法。这是我在 Objective C 中的代码，相关部分已注释：
// improvements in the search bar wrapper
@interface SearchBarWrapper : UIView
@property (nonatomic, strong) UISearchBar *searchBar;
- (instancetype)initWithSearchBar:(UISearchBar *)searchBar;
@end
@implementation SearchBarWrapper
- (instancetype)initWithSearchBar:(UISearchBar *)searchBar {
// setting width to a large value fixes stretch-on-rotation
self = [super initWithFrame:CGRectMake(0, 0, 4000, 44)];
if (self) {
self.searchBar = searchBar;
[self addSubview:searchBar];
}
return self;
}
- (void)layoutSubviews {
[super layoutSubviews];
self.searchBar.frame = self.bounds;
}
// fixes width some cases of resizing while search is active
- (CGSize)sizeThatFits:(CGSize)size {
return size;
}
@end
// then use it in your VC
@implementation MyViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.navigationItem.titleView = [[SearchBarWrapper alloc] initWithSearchBar:self.searchController.searchBar];
}
@end
现在还有一个案例我还没有弄清楚。要重现，请执行以下操作：
- 从纵向开始
- 激活搜索字段
- 旋转到横向
- 错误：栏没有调整大小
【讨论】：
所有解决方案都不适合我，所以在我推送视图控制器之前我做了：
override func viewWillDisappear(_ animated: Bool) {
super.viewWillDisappear(animated)
self.navigationItem.titleView = UIView()
}
并在返回时显示搜索栏：
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
self.navigationItem.titleView = UISearchBar()
}
【讨论】：
//
// Created by Sang Nguyen on 10/23/17.
// Copyright © 2017 Sang. All rights reserved.
//
import Foundation
import UIKit
class CustomSearchBarView: UISearchBar {
final let SearchBarHeight: CGFloat = 44
final let SearchBarPaddingTop: CGFloat = 8
override open func awakeFromNib() {
super.awakeFromNib()
self.setupUI()
}
override init(frame: CGRect) {
super.init(frame: frame)
self.setupUI()
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
// fatalError("init(coder:) has not been implemented")
}
func findTextfield()-> UITextField?{
for view in self.subviews {
if view is UITextField {
return view as? UITextField
} else {
for textfield in view.subviews {
if textfield is UITextField {
return textfield as? UITextField
}
}
}
}
return nil;
}
func setupUI(){
if #available(iOS 11.0, *) {
self.translatesAutoresizingMaskIntoConstraints = false
self.heightAnchor.constraint(equalToConstant: SearchBarHeight).isActive = true
}
}
override func layoutSubviews() {
super.layoutSubviews()
if #available(iOS 11.0, *) {
if let textfield = self.findTextfield() {
textfield.frame = CGRect(x: textfield.frame.origin.x, y: SearchBarPaddingTop, width: textfield.frame.width, height: SearchBarHeight - SearchBarPaddingTop * 2)`enter code here`
return
}
}
}
}
【讨论】：
在 Objective-C 中
if (@available(iOS 11.0, *)) {
[self.searchBar.heightAnchor constraintLessThanOrEqualToConstant: 44].active = YES;
}
【讨论】：
我尝试了各种方法来将大小恢复到原来的 44，但是搜索栏的外观和行为总是很奇怪——比如被拉远、y 偏移等等。
我在这里找到了一个不错的解决方案（通过其他一些 stackoverflow 帖子）： https://github.com/DreamTravelingLight/searchBarDemo
只需从 SearchViewController 派生您的视图控制器，并在您的项目中包含 SearchViewController 和 WMSearchbar 类。为我开箱即用，没有任何丑陋的 if (iOS11) else... 丑陋。
【讨论】：
编辑：@zgjie 答案是解决此问题的更好方法：https://stackoverflow.com/a/46356265/1713123
这似乎是因为在 iOS 11 中 SearchBar 的默认高度值已更改为 56，而不是之前的 iOS 版本中的 44。
目前，我已应用此解决方法，将 searchBar 高度设置回 44：
let barFrame = searchController.searchBar.frame
searchController.searchBar.frame = CGRect(x: 0, y: 0, width: barFrame.width, height: 44)
另一种解决方案是使用new searchController property on navigationItem in iOS 11：
navigationItem.searchController = searchController
但是这样 da searchBar 会出现在导航标题下方。
【讨论】：
CGRect().insetBy(dx:dy:) 和 CGRect().offsetBy(dx:dy:)，在这种情况下 - searchController.searchBar.frame = searchController.searchBar.frame.insetBy(dx: 0, dy: -12)
我相信 iOS 11 UISearchBar 现在的高度等于 56，并且 UINavigationBar 使用自动布局来适应它的子视图，因此它增加了高度。如果您仍然希望 UISearchBar 作为 iOS 11 之前的 titleView，我发现最好的方法是将 UISearchBar 嵌入自定义视图中，并将该视图的高度设置为 44，并将其分配给 navigationItem.titleView
class SearchBarContainerView: UIView {
let searchBar: UISearchBar
init(customSearchBar: UISearchBar) {
searchBar = customSearchBar
super.init(frame: CGRect.zero)
addSubview(searchBar)
}
override convenience init(frame: CGRect) {
self.init(customSearchBar: UISearchBar())
self.frame = frame
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func layoutSubviews() {
super.layoutSubviews()
searchBar.frame = bounds
}
}
class MyViewController: UIViewController {
func setupNavigationBar() {
let searchBar = UISearchBar()
let searchBarContainer = SearchBarContainerView(customSearchBar: searchBar)
searchBarContainer.frame = CGRect(x: 0, y: 0, width: view.frame.width, height: 44)
navigationItem.titleView = searchBarContainer
}
}
【讨论】：
就我而言，更大的 UINavigationBar 的高度对我来说不是问题。我只需要重新对齐左右栏按钮项目。这就是我想出的解决方案：
- (void)iOS11FixNavigationItemsVerticalAlignment
{
[self.navigationController.navigationBar layoutIfNeeded];
NSString * currSysVer = [[UIDevice currentDevice] systemVersion];
if ([currSysVer compare:@"11" options:NSNumericSearch] != NSOrderedAscending)
{
UIView * navigationBarContentView;
for (UIView * subview in [self.navigationController.navigationBar subviews])
{
if ([subview isKindOfClass:NSClassFromString(@"_UINavigationBarContentView")])
{
navigationBarContentView = subview;
break;
}
}
if (navigationBarContentView)
{
for (UIView * subview in [navigationBarContentView subviews])
{
if (![subview isKindOfClass:NSClassFromString(@"_UIButtonBarStackView")]) continue;
NSLayoutConstraint * topSpaceConstraint;
NSLayoutConstraint * bottomSpaceConstraint;
CGFloat topConstraintMultiplier = 1.0f;
CGFloat bottomConstraintMultiplier = 1.0f;
for (NSLayoutConstraint * constraint in navigationBarContentView.constraints)
{
if (constraint.firstItem == subview && constraint.firstAttribute == NSLayoutAttributeTop)
{
topSpaceConstraint = constraint;
break;
}
if (constraint.secondItem == subview && constraint.secondAttribute == NSLayoutAttributeTop)
{
topConstraintMultiplier = -1.0f;
topSpaceConstraint = constraint;
break;
}
}
for (NSLayoutConstraint * constraint in navigationBarContentView.constraints)
{
if (constraint.firstItem == subview && constraint.firstAttribute == NSLayoutAttributeBottom)
{
bottomSpaceConstraint = constraint;
break;
}
if (constraint.secondItem == subview && constraint.secondAttribute == NSLayoutAttributeBottom)
{
bottomConstraintMultiplier = -1.0f;
bottomSpaceConstraint = constraint;
break;
}
}
CGFloat contentViewHeight = navigationBarContentView.frame.size.height;
CGFloat subviewHeight = subview.frame.size.height;
topSpaceConstraint.constant = topConstraintMultiplier * (contentViewHeight - subviewHeight) / 2.0f;
bottomSpaceConstraint.constant = bottomConstraintMultiplier * (contentViewHeight - subviewHeight) / 2.0f;
}
}
}
}
基本上，我们搜索包含条形按钮项的堆栈视图，然后更改它们的顶部和底部约束值。是的，这是一个肮脏的黑客，如果您可以通过任何其他方式解决您的问题，则不建议使用它。
【讨论】：