UISearchBar erhöht die Höhe der Navigationsleiste in iOS 11

Ich bin UISearchBarTeil der Navigationsleiste wie folgt:

 let searchBar = UISearchBar()
 //some more configuration to the search bar
 .....
 navigationItem.titleView = searchBar

Nach dem Update auf iOS 11etwas Seltsames passierte die Suchleiste in meiner App. Am iOS 10und vor hatte ich meine Navigationsleiste wie folgt aussehen:

Jetzt mit habe iOS 11ich:

Wie Sie sehen, gibt es einen Unterschied in der Rundung der beiden Suchleisten, der mich nicht stört. Das Problem ist, dass die Suchleiste die Höhe der Navigationsleiste erhöht. Wenn ich also zu einem anderen Controller gehe, sieht es auch komisch aus:

Tatsächlich entspricht die Höhe der seltsamen schwarzen Linie plus der aktuellen Navigationsleiste der Höhe der im zweiten Bild gezeigten Navigationsleiste ...

Irgendwelche Ideen, wie man die schwarze Linie loswird und eine einheitliche Höhe der Navigationsleiste über alle Ansichts-Controller hinweg hat?

Ich habe in zwei Fällen unter NavigationBar mit SearchBar in iOS 11 eine schwarze Linie erhalten:

• als ich einen anderen ViewController von ViewController mit UISearchBar schob

• als ich ViewController mit UISearchBar mit "Recht auf Entlassung ziehen" entließ

Meine Lösung war: Hinzufügen dieses Codes zu meinem ViewController mit UISearchBar:

-(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 Update

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    navigationController?.view.setNeedsLayout() // force update layout
    navigationController?.view.layoutIfNeeded() // to fix height of the navigation bar
}

Sie können der Suchleiste für iOS 11 eine Einschränkung der Höhe 44 hinzufügen.

// Schnell

if #available(iOS 11.0, *) {
    searchBar.heightAnchor.constraint(equalToConstant: 44).isActive = true
}

// Ziel c

if (@available(iOS 11.0, *)) {
    [searchBar.heightAnchor constraintEqualToConstant:44].active = YES;
}

Ich glaube, in iOS 11 hat UISearchBar jetzt eine Höhe von 56, und UINavigationBar verwendet Autolayout, um seine Unteransichten anzupassen, wodurch die Höhe erhöht wird. Wenn Sie UISearchBar weiterhin als titleView wie vor iOS 11 verwenden möchten, habe ich herausgefunden, dass es am besten ist, UISearchBar in eine benutzerdefinierte Ansicht einzubetten, die Höhe dieser Ansicht auf 44 festzulegen und sie navigationItem.titleView zuzuweisen

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  
    }  
} 

Versuchen Sie diesen Code auf dem View Controller "ACKNOWLEDGMENTS" in viewDidLoad

self.extendedLayoutIncludesOpaqueBars = true

Danke euch allen! Ich habe endlich eine Lösung gefunden.

Hinzufügen des folgenden Codes zu ViewController mit UISearchBar.

1. Erster Schritt: viewDidLoad

-(void)viewDidLoad
{
    [super viewDidLoad];
    self.extendedLayoutIncludesOpaqueBars = YES;
    ...
}

override func viewDidLoad() {
    super.viewDidLoad()
    self.extendedLayoutIncludesOpaqueBars = true
}

2. Zweiter Schritt: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
    }

In Ziel-C

if (@available(iOS 11.0, *)) {
        [self.searchBar.heightAnchor constraintLessThanOrEqualToConstant: 44].active = YES;
}              

Das passiert mir auch, alles läuft gut in iOS 12.4 und wird in 13 oben komisch. Das Problem besteht darin, dass die Höhe der Navigationsleiste in iOS 13 nach dem Sprung von UIViewController, der searchBar implementiert, von 88 auf 100 erhöht wurde.

Versuchen Sie dies in Ihrem UIViewController, der searchBar implementiert.

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    navigationController?.view.setNeedsLayout()
    navigationController?.view.layoutIfNeeded()
}

Vorschau nach dem Fixieren:

Vorschau vor dem Reparieren:

BEARBEITEN: Die @ zgjie-Antwort ist eine bessere Lösung für dieses Problem: https://stackoverflow.com/a/46356265/1713123

Es scheint, dass dies passiert, weil in iOS 11 der Standardhöhenwert von SearchBar auf 56 geändert wurde, statt auf 44 in früheren iOS-Versionen.

Im Moment habe ich diese Problemumgehung angewendet und die Höhe der Suchleiste auf 44 zurückgesetzt:

let barFrame = searchController.searchBar.frame
searchController.searchBar.frame = CGRect(x: 0, y: 0, width: barFrame.width, height: 44)    

Eine andere Lösung könnte die neue searchController-Eigenschaft für navigationItem in iOS 11 sein :

navigationItem.searchController = searchController

Auf diese Weise wird die Suchleiste unter dem Navigationstitel angezeigt.

Alle Lösungen haben bei mir nicht funktioniert. Bevor ich den View Controller drückte, tat ich Folgendes:

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)

    self.navigationItem.titleView = UIView()
}

Und um die Suchleiste beim Zurückgehen präsent zu machen:

override func viewWillAppear(_ animated: Bool) {
    super.viewWillAppear(animated)

    self.navigationItem.titleView = UISearchBar()
}

Ich konnte die Lösung, die navBar auf 44 zu halten, nicht verwenden. Also habe ich einen Tag gebraucht, aber schließlich habe ich eine Lösung gefunden, die die Balkenhöhe nicht ändert und den Knopf in der Mitte der Bar positioniert. Das Problem ist, dass die Schaltflächen in einer Stapelansicht platziert sind, die als horizontale Stapelansicht konfiguriert ist und sich daher nicht an die Höhenänderung anpasst.

Dies geschieht auf init:

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)];
}

on viewWillApear (oder jederzeit, nachdem die Ansicht dem Navigationsstapel hinzugefügt wurde)

   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];
        }
    }

Und subviewOfClass ist eine Kategorie in 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;
}

Alles, was Sie tun müssen, ist, UISearchBar zu unterordnen und "intrinsicContentSize" zu überschreiben:

@implementation CJSearchBar
-(CGSize)intrinsicContentSize{
    CGSize s = [super intrinsicContentSize];
    s.height = 44;
    return s;
}
@end

Ich konnte keinen Kommentar abgeben, wollte aber einige zusätzliche Probleme mitteilen, auf die ich gestoßen bin, während ich viele Stunden damit verbracht habe, diesem Problem auf den Grund zu gehen, selbst nachdem ich eine der anderen Lösungen verwendet habe.

Es scheint, dass Andrews Antwort die beste Lösung für mich war :

override func viewWillDisappear(_ animated: Bool) {
    super.viewWillDisappear(animated)
    navigationController?.view.setNeedsLayout() // force update layout
    navigationController?.view.layoutIfNeeded() // to fix height of the navigation bar
}

Zumindest in iOS 12.1 , wenn Ihr UINavigationBar:

• hat isTranslucentzu setzen false, erhält der View - Controller mit der Suchleiste erscheint nicht , dass es nach Ansicht des Layout angepasst zurück , wenn interaktiv (normal entlasse über Zurück - Taste erscheint auf der Arbeit) zu entlassen.
• Wenn das Hintergrundbild mit eingestellt ist setBackgroundImage(UIImage(), for: .default), funktioniert die Übergangsanimation nicht richtig und springt nach Abschluss an ihre Position zurück.

Diese besonderen Eigenschaften wurden so eingestellt, dass die Navigationsleiste auf eine bestimmte Weise angezeigt wird. Daher muss ich einige Anpassungen vornehmen, um sie wieder herzustellen, oder mich mit dem seltsamen Verhalten abfinden. Ich werde versuchen, mich daran zu erinnern, das oben Gesagte zu aktualisieren, wenn ich auf etwas anderes stoße oder andere Lösungen oder Unterschiede in anderen Betriebssystemversionen finde.

In meinem Fall war eine größere UINavigationBar-Größe für mich kein Problem. Ich musste nur die Elemente der linken und rechten Leistenschaltfläche neu ausrichten. Das ist die Lösung, die ich mir ausgedacht habe:

- (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;
            }
        }
    }
}

Grundsätzlich suchen wir nach Stapelansichten, die Elemente von Balkenschaltflächen enthalten, und ändern dann die Werte für die oberen und unteren Einschränkungen. Ja, es ist ein Dirt-Hack und wird nicht empfohlen, ihn zu verwenden, wenn Sie Ihr Problem auf andere Weise beheben können.

//
//  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
            }
        }
    }
}

Ich fand, dass die Lösung von Mai Mai die einzige ist, die wirklich brauchbar ist.
Es ist jedoch immer noch nicht perfekt:
Beim Drehen des Geräts wird die Größe der Suchleiste nicht richtig geändert und bleibt in der kleineren Dimension.

Ich habe eine Lösung dafür gefunden. Hier ist mein Code in Ziel C mit den entsprechenden kommentierten Teilen:

// 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

Jetzt gibt es noch einen Fall, den ich noch nicht herausgefunden habe. Gehen Sie zum Reproduzieren wie folgt vor:
- Im Hochformat starten
- Suchfeld aktivieren
- In Querformat drehen
- Fehler: Die Größe der Leiste wird nicht geändert

Ich habe dies behoben, indem ich die Einschränkung zu viewDidAppear auf dem Kartenansichts-Controller hinzugefügt habe, in den die Suchleiste eingebettet ist

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
    }
}

Hallo zu den Menschen , die verwendet UISearchControllerund dann seine Befestigung UISearchBaran den navigationItem.titleView. Ich habe verrückte 4-5 Stunden meines Tages damit verbracht, dies zu lösen. Das Befolgen des von iOS 11+ empfohlenen Ansatzes, der das searchControllerauf den Punkt bringt, navigation.searchControllerist nicht nur für meinen Fall richtig. Der Bildschirm mit diesem searchController / searchBar verfügt über einen benutzerdefinierten backButton.

Ich habe dies in iOS 10, iOS 11 und 12 getestet. Auf verschiedenen Geräten. Ich musste einfach. Ich kann nicht nach Hause gehen, ohne diesen Dämon zu lösen. Dies ist das Perfekteste, was ich heute tun kann, angesichts meiner engen Frist.

Ich möchte nur diese harte Arbeit teilen, die ich geleistet habe. Es liegt an Ihnen, alles zu platzieren, wo immer Sie wollen (z. B. Variablen in Ihrem viewModel). Hier kommt's:

In meinem ersten Bildschirm (z. B. Startbildschirm, auf dem dieser Suchcontroller nicht vorhanden ist) habe ich diesen in meinem viewDidLoad().

self.extendedLayoutIncludesOpaqueBars = true

In meinem zweiten Bildschirm, dem mit dem searchController, habe ich diesen in meinem viewDidAppear.

überschreiben func viewDidAppear (_ animiert: Bool) {super.viewDidAppear (animiert)

    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.
}

und hier ist die Erklärung meines searchControllers:

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
}()

Ich hoffe, das hilft irgendwann jemandem.

Ich habe verschiedene Dinge versucht, um die Größe wieder auf das Original 44 zu bringen, aber dann sieht die Suchleiste immer komisch aus und verhält sich auch so - als wäre sie zu weit gedehnt, y-versetzt und gleich.

Ich habe hier eine gute Lösung gefunden (über einen anderen Stackoverflow-Beitrag): https://github.com/DreamTravelingLight/searchBarDemo

Leiten Sie einfach Ihren Viewcontroller vom SearchViewController ab und fügen Sie die Klassen SearchViewController und WMSearchbar in Ihr Projekt ein. Arbeitete sofort für mich ohne hässliche wenn (iOS11) sonst ... Hässlichkeit.

In meinem Fall muss ich die Höhe des Textfelds um 36pt -> 28pt verringern.

Also habe ich versucht, die Höhe des Rahmens und der Ebene zu ändern. Aber die Wege haben nicht funktioniert.

Schließlich fand ich eine Lösung, die die Maske ist. Ich denke, es ist kein guter Weg, aber es funktioniert.

    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
    }

Sie können die Einfügungen ändern, wenn Sie den Rahmen von textField ändern möchten.