search

software-mansion / react-native-screens

Native navigation primitives for your React Native app.
https://docs.swmansion.com/react-native-screens/
MIT License
3.03k stars 514 forks source link

[Feature Request] UISearchBar for iOS with Native Header #608

Closed Evan-Younan closed 4 years ago

Evan-Younan commented 4 years ago

React Native Navigation has implemented the UISearchBar that exists in the native TopBar of iOS. It has options such as: hideNavBarOnFocusSearchBar, searchBarHiddenWhenScrolling, etc., which is a common UI element in a few native iOS applications that I use. I am just wondering if the implementation of a UISearchBar as one of the options to the navigation header is something that was already thought about or can be done easily.

Documentation of react-native-navigation's searchBar props (and other related props) can be found here: https://wix.github.io/react-native-navigation/api/options-stack#searchbar

Evan-Younan commented 4 years ago

It seems like this can be achieved by manipulating the headerShown option of the header. If the TextInput can emit focus and blur events, this behaviour can be achieved by simply toggling the option. If there are any issues I see with this approach, I'll post an update.

a-eid commented 3 years ago

@Evan-Younan could u post an example of this ? does it work as a normal ios uisearchbar does ?

Dec-10-2020 05-32-22

Evan-Younan commented 3 years ago

@a-eid No, this cannot be achieved with the current implementation. I think that RNN supports a UISearch component in the navigation header though.

a-eid commented 3 years ago

yeah, I know there are other libs that supports this, thanks.