How to display search type Android keyboard in react-native

Question

I've got a text input in my app which I use as a search bar and I know that Android has an API to display a search type keyboard and I'm wondering how I can use it in react-native.

I've looked in the react-native text input documentation but didn't find anything for that type of keyboard in Android.

my screen

Anyone knows which type of keyboard I can use in text input to achieve wanted result?

Oleksandr Leskiv · Accepted Answer · 2019-01-16 09:58:58Z

15

Looks like you're looking for returnKeyType and keyboardType

answered Jan 16, 2019 at 9:58

Oleksandr Leskiv

6687 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jeremy Caney · Accepted Answer · 2024-08-16 21:58:14Z

1

It seems like you want to show a keyboard layout that has a search icon in the bottom right corner, similar to:

Something like this

There is a property called returnKeyType, and if you set its type to search, you'll see the desired layout:

Example:

<TextInput placeholder='Search...' 
            returnKeyType="search" // This will show the search icon
            onSubmitEditing={handleSearch} // This handles the search icon press
            value={searchText}
            onChangeText={(text) => setSearchText(text)}/>

edited Aug 16, 2024 at 21:58

Jeremy Caney

7,808115 gold badges57 silver badges86 bronze badges

answered Aug 9, 2024 at 10:50

Shaik Nayyar Rabbani

112 bronze badges

Collectives™ on Stack Overflow

How to display search type Android keyboard in react-native

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related