Ali Zeynalov
Ali Zeynalov

Reputation: 3017

React-Native cannot write first letter with noncapital

I have some trouble with react-native. I have an Input component(like textfield) for user to enter his email address, but the thing is that, first letter always comes as capital letter default and it is impossible to make it non-capital. How can I change it like first letter can be small, as well? enter image description here

Upvotes: 158

Views: 105569

Answers (6)

halcyonshift
halcyonshift

Reputation: 66

Just in case anyone else comes looking on this and the answers above don't work, the following did the trick for me:

<TextInput 
    autoCapitalize='none'
    keyboardType='email-address'
    spellCheck={false} 
/>

Upvotes: 0

docker compose
docker compose

Reputation: 868

Setting keyboardType="web-search" worked for me.

<TextInput keyboardType="web-search" />

Upvotes: 2

Siddhartha Mukherjee
Siddhartha Mukherjee

Reputation: 2951

just use autoCapitalize='none', it's will worked fine

Upvotes: 5

Sport
Sport

Reputation: 8965

TextInput has autoCapitalize to handle this.

`autoCapitalize enum('none', 'sentences', 'words', 'characters')`

For example try like this:

<TextInput
   placeholder=""
   placeholderTextColor='rgba(28,53,63, 1)'
   autoCapitalize='none'
   value='test'
/>

Upvotes: 385

Matheus Camara
Matheus Camara

Reputation: 559

Make sure that the property autoCorrect is false. This way it will not capitalize the first email character. Also setting the keyboardType to email-address shows the keyboard with an @ option accessible. That's how I would do:

          <TextInput
            textContentType='emailAddress'
            keyboardType='email-address'
            autoCapitalize='none'
            autoCorrect={false}
            autoCompleteType='email'
          />

Upvotes: 31

Vishal Dhaduk
Vishal Dhaduk

Reputation: 520

If you have an issue with TextInput to make all letters uppercase then you can use autoCapitalize = 'characters' and if you want only first characters to be uppercase then use autoCapitalize = 'words'. However, make sure you do not set the keyboard type property.

Upvotes: 5

Related Questions