Menu
I want to change the color or the border in this code before the focus I want the color red and on the focus I want the color yellow.
This my work https://prnt.sc/o8evi5
This is the code I have and I am using React Native Paper https://callstack.github.io/react-native-paper/text-input.html
<TextInput
label='Email or username'
mode='outlined'
theme={{ colors: { underlineColor:'red',}}}
style={(this.state.isFocused) ? {borderColor: 'black', borderColor: 'black',} : {fontStyle: 'italic', color: 'white'}}
selectionColor='red'
underlineColor='red'
placeholder='[email protected]'
keyboardType='email-address'
underlineColorAndroid='transparent'
autoCorrect='false'
autoCapitalize='none'
onChangeText={formikProps.handleChange('email')}
onBlur={formikProps.handleBlur('email')}
//autoFocus
/>
I tried this but it didn't gave me what I want https://github.com/callstack/react-native-paper/issues/656
455
import { Platform, StyleSheet, Text, View, TextInput } from "react-native"; Step-3 : Create TextInput component inside the render block and specify borderWidth, borderColor property of CSS Stylesheet in TextInput Component. This CSS property will set the border color in TextInput layout.
create({ input: { borderColor: "gray", width: "100%", borderWidth: 1, borderRadius: 10, padding: 10, }, }); In the piece of code above, we styled the text box's border and gave it some padding. Furthermore, we used the borderRadius property. This tells React to add rounded borders.
This code worked inside the TextInput Tag.
theme={{ colors: { primary: 'green',underlineColor:'transparent',}}}
With primary, you can change the border color on focused. Reference: https://github.com/callstack/react-native-paper/issues/656
128
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With