Reputation: 5213
I have an app which has a search bar that appears in the navigation bar and my set up is a hybrid of SwiftUI and UIKit.
I don't think this has bearing on the question at hand but here is my set up:
I have a custom hosting controller to control handle my searches, set up something like this:
class IndexSearchHostingController<Content: View>: UIHostingController<Content>, UISearchControllerDelegate, UISearchBarDelegate {
init(rootView: Content) {
super.init(rootView: rootView)
addSearchBar()
}
private lazy var searchController: UISearchController = {
let viewController = UIHostingController(rootView: SearchResultsView())
let search = UISearchController(searchResultsController: viewController)
search.delegate = self
search.showsSearchResultsController = true
search.obscuresBackgroundDuringPresentation = true
search.searchBar.delegate = self
return search
}()
private func addSearchBar() {
let image = UIImage(named: "iconName")?.withRenderingMode(.automatic)
searchController.searchBar.placeholder = "Search"
searchController.searchBar.setImage(image, for: .search, state: .normal)
searchController.searchBar.autocapitalizationType = .none
navigationItem.searchController = searchController
navigationItem.hidesSearchBarWhenScrolling = false
}
}
// Somewhere else in my code:
let viewController = IndexSearchHostingController(rootView: SwiftUIHomeView())
viewController.tabBarItem = tabBarItem.value
let navigationController = UINavigationController(rootViewController: viewController)
This works fine and I get the standard iOS search experience
However, because we want to add some more things to the navigation bar, it is getting quite crowded, I want to remove the search bar from the navigation bar and add a right bar button for search instead. Tapping this would launch the search experience.
How could we customize the transition / navigation experience to the search results controller be like spotify?
To try and replicate,
@objc func showSearch() {
navigationItem.searchController = searchController
// Without the delay, I had to tap the button twice
DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
self.searchController.isActive = true
self.searchController.becomeFirstResponder()
}
}
This again works but the transition / animation is not very nice and a bit delayed.
Within the dispatch block I tried messing with some scale properties of the search bar but it looks nothing close to like what we see in Spotify.
So How could we customize the transition / navigation experience to the search results controller be like spotify which seems like the search bar transitions out from the button.
Upvotes: 0
Views: 27