Uisearchbar in Navigationbar

UISearchBar in navigationbar

To put searchBar into the center of navigationBar:

self.navigationItem.titleView = self.searchBarTop;

To put searchBar to the left/right side of navigationBar:

UIBarButtonItem *searchBarItem = [[UIBarButtonItem alloc] initWithCustomView:searchBar];
self.navigationItem.rightBarButtonItem = searchBarItem;

iOS 11 UISearchBar in UINavigationBar

Now it's what you want...

if #available(iOS 11.0, *) {
            let sc = UISearchController(searchResultsController: nil)
            sc.delegate = self
            let scb = sc.searchBar
            scb.tintColor = UIColor.white
            scb.barTintColor = UIColor.white


            if let textfield = scb.value(forKey: "searchField") as? UITextField {
                textfield.textColor = UIColor.blue
                if let backgroundview = textfield.subviews.first {

                    // Background color
                    backgroundview.backgroundColor = UIColor.white

                    // Rounded corner
                    backgroundview.layer.cornerRadius = 10;
                    backgroundview.clipsToBounds = true;

                }
            }

            if let navigationbar = self.navigationController?.navigationBar {
                navigationbar.barTintColor = UIColor.blue
            }
            navigationItem.searchController = sc
            navigationItem.hidesSearchBarWhenScrolling = false

}

Result:

With Rounded corner:

Animation with rounded corner is also working fine.

UISearchBar color in NavigationBar

Maybe the best solution is for creating an extension for UISearchBar if you want to use these settings in more controllers. Here are some example.

extension UISearchBar {

    private func getViewElement(type: T.Type) -> T? {

        let svs = subviews.flatMap { $0.subviews }
        guard let element = (svs.filter { $0 is T }).first as? T else { return nil }
        return element
    }

    func getSearchBarTextField() -> UITextField? {
        return getViewElement(type: UITextField.self)
    }

    func setTextColor(color: UIColor) {

        if let textField = getSearchBarTextField() {
            textField.textColor = color
        }
    }

    func setTextFieldColor(color: UIColor) {

        if let textField = getViewElement(type: UITextField.self) {
            switch searchBarStyle {
            case .minimal:
                textField.layer.backgroundColor = color.cgColor
                textField.layer.cornerRadius = 6
            case .prominent, .default:
                textField.backgroundColor = color
            @unknown default:
                print("something")
            }
        }
    }

    func setPlaceholderTextColor(color: UIColor) {

        if let textField = getSearchBarTextField() {
            textField.attributedPlaceholder = NSAttributedString(string: self.placeholder != nil ? self.placeholder! : "", attributes: [NSAttributedString.Key.foregroundColor: color])
        }
    }

    func setTextFieldClearButtonColor(color: UIColor) {

        if let textField = getSearchBarTextField() {

            let button = textField.value(forKey: "clearButton") as! UIButton
            if let image = button.imageView?.image {
                button.setImage(image.transform(withNewColor: color), for: .normal)
            }
        }
    }

    func setSearchImageColor(color: UIColor) {

        if let imageView = getSearchBarTextField()?.leftView as? UIImageView {
            imageView.image = imageView.image?.transform(withNewColor: color)
        }
    }
}

Update:

Change navigationItem.searchController = sc to navigationItem.titleView = sc.searchBar.

How to replace the navigation bar with an UISearchBar?

I could make my first option to

I would like to replace the navigation bar with the search bar once shown and back.

work.

I used the approach to show and hide the left and right bat button items of the navigation item when the UISearchBar is being shown.

I would be interested if there is a simpler way to achieve the same?

@interface MyViewController() 
@end

@implementation MyViewController
{
  UIView*                    _navigationItemTitleView;
  NSArray* _leftBarButtonItems;
  NSArray* _rightBarButtonItems;
}

- (void)viewDidLoad
{
  _searchController        = [[UISearchController alloc] initWithSearchResultsController:[[MySearchViewController alloc] init]];
  // ....
  _navigationItemTitleView = self.navigationItem.titleView;
  _leftBarButtonItems      = self.navigationItem.leftBarButtonItems;
  _rightBarButtonItems     = self.navigationItem.rightBarButtonItems;
}

- (void)searchButtonTapped:(id)sender
{
  // show the search bar in the navigation item
  self.navigationItem.leftBarButtonItems  = nil;
  self.navigationItem.rightBarButtonItems = nil;
  self.navigationItem.titleView = _searchController.searchBar;
  _searchController.active = TRUE;
}

- (void)willDismissSearchController:(UISearchController*)searchController
{
  // hide the search bar and restore previous state of the navigation item
  self.navigationItem.leftBarButtonItems  = _leftBarButtonItems;
  self.navigationItem.rightBarButtonItems = _rightBarButtonItems;
  self.navigationItem.titleView           = _navigationItemTitleView;
}

iOS 11 UISearchBar in navigation bar

Look answer in UIPercentDrivenInteractiveTransition. It's using for update UIViews during UINavigationController transition in persentage value.

Other words, depends on how much UINavigationController already opened next view controller or move backwards views will have different appearance.

This value will help you update your search bar (alpha, width, etc.)

ios11: UISearchBar in Navigation Bar

I believe the search bar and the nav bar are two separate elements so your gradient is only effecting one. You can set them both to clear and then put another view or label element behind (add constraints) with the gradient you're looking for.

for the searchBar you want to set both the barTintColor and the backgroundImage with the following code.

override func viewDidLoad() {
    self.searchBar.barTintColor = UIColor.clear
    self.searchBar.backgroundImage = UIImage()
    self.navBar.backgroundColor = UIColor.clear
}

---

Related Topics