Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ReactNative: Remove underline on TextInput for Android

I'm struggling on a dumb issue here with styling a TextInput. For some reason, I need to have a border line on a View that contains a TextInput.

Therefore, I don't want the TextInput to display its border line. On iOS, everything's fine without doing anything but on Android, it still displays a black underline.

I've tried to set borderWidth to 0, to set the borderColor to transparent but it doesn't change anything.

What should I do?

like image 202
Pierre-Olivier Dybman Avatar asked May 29 '17 22:05

Pierre-Olivier Dybman


1 Answers

Ok, I found how to fix this. There is a special props for Android which is underlineColorAndroid. It's set by default so if you want your border line to be invisible, simply do as follow:

<TextInput
        ...
        underlineColorAndroid={'rgba(0,0,0,0)'}
      />
like image 168
Pierre-Olivier Dybman Avatar answered Nov 17 '22 05:11

Pierre-Olivier Dybman