4

First I want to say I didn't find any good answer about it in Swift. I created search bar. On button click it shows and on cancel it hides the searchbar. It is working properly, cancel button is visible on all iPhones but for some reason not on iPad. What should cause this?

That is how I create the searchbar:

//Create searchbar
    func createSearchBar(){

        searchBar.showsCancelButton = true
        searchBar.tintColor = UIColor(red:0.184, green:0.996, blue:0.855, alpha:1.00)
        searchBar.placeholder = "Search brands"
        searchBar.delegate = self



        searchBar.hidden =  false
        searchBar.alpha = 0

        navigationItem.titleView = searchBar
        navigationItem.setLeftBarButtonItem(menuButton, animated: true)
        navigationItem.setRightBarButtonItem(searchButtton, animated: true)


        UIView.animateWithDuration(0.5, animations: {
            self.searchBar.alpha = 1
            }, completion: { finished in
                self.searchBar.becomeFirstResponder()
        })


    }
Tarvo Mäesepp
  • 4,477
  • 3
  • 44
  • 92

4 Answers4

12

Faced the same one of my project. I've posted on apple forum and lot of developers commented as a xcode bug. So I added the cancel button manually for ipad views

 func configureCancelBarButton() {
    let cancelButton = UIBarButtonItem()
    cancelButton.image = UIImage(named: "cancelButton")
    cancelButton.action = #selector(viewController.ipadCancelButton(_:))
    cancelButton.target = self
    self.navigationItem.setRightBarButtonItem(cancelButton, animated: true)
}

And I previously posted an answer about this question. Check that too. :)

Community
  • 1
  • 1
Mudith Chathuranga Silva
  • 7,253
  • 2
  • 50
  • 58
7

https://developer.apple.com/documentation/uikit/uisearchbar/1624283-showscancelbutton

The value of this property is ignored, and no cancel button is displayed, for apps running on iPad.

Apple add that in documents!

user2958279
  • 570
  • 1
  • 5
  • 11
2

UISearchBar works differently on iPads and iPhones when used as a navigationItem. On an iPad, the cancel button is replaced by a "back" button, while on an iPhone, the cancel button is still displayed as a button.*

  1. On an iPad, if you are using a UISearchBar as a navigationItem in a UINavigationBar, the cancel button will not be displayed. However, if you are using a UISearchBar in any other context, such as within a view controller, the cancel button will be displayed and will function as expected.

  2. On an iPhone, the UISearchBar can be used both as a navigationItem and within a view controller. In both cases, the cancel button will be displayed and will function as expected.

  3. When the UISearchBar is used as a navigationItem on an iPhone, the cancel button is displayed as a right bar button item when the user starts editing the search bar. This allows the user to easily cancel the search and return to the previous screen.

    On an iPad, if you are using a UISearchBar as a navigationItem in a UINavigationBar, the cancel button will not be displayed. However, if you are using a UISearchBar in any other context, such as within a view controller, the cancel button will be displayed and will function as expected.

     func setupCancelButton() {
    let cancelButton = UIButton(type: .system)
     // Set button title
    cancelButton.setTitle("Cancel", for: .normal)
     // Add target
    cancelButton.addTarget(self, action: #selector(cancelButtonTapped), for: .touchUpInside)
    cancelButton.translatesAutoresizingMaskIntoConstraints = false
    
    let image = UIImage(named: "cancel_icon")?.withRenderingMode(.alwaysTemplate)
    // Set image 
    cancelButton.setImage(image, for: .normal)
    cancelButton.tintColor = .black
    
    searchBar.addSubview(cancelButton)
    searchBar.setShowsCancelButton(false, animated: false)
    
    NSLayoutConstraint.activate([
        cancelButton.topAnchor.constraint(equalTo: searchBar.topAnchor, constant: 0),
        cancelButton.bottomAnchor.constraint(equalTo: searchBar.bottomAnchor, constant: 0),
        cancelButton.trailingAnchor.constraint(equalTo: searchBar.trailingAnchor, constant: -8),
        cancelButton.widthAnchor.constraint(equalToConstant: 50)
    ])}
    
    @objc func cancelButtonTapped() {
    searchBar.text = ""
    searchBar.resignFirstResponder()
    

    }

Call the above function from viewDidLoad to setup the UISearchBar

Aseem
  • 423
  • 5
  • 7
0

The UISearchbar's cancel button will work in iPads if you are NOT using the UISearchbar as NavigationBarItem.

john raja
  • 509
  • 4
  • 8