Don't grey out Disabled Input in React Native Elements - react-native

Question

I am trying to change the color of disabled React-native-elements component Input. Default behaviour is to grey out everything but I would like to have solid black color of the text even if it's disabled. Has anybody tips of how to do it?

Answer 1

Set disabledInputStyle prop to opacity: 1
disabledInputStyle={{opacity: 1}}

Answer 2

I first read the official API and find the disabledInputStyle, then I look at the Input source in react-naive-element.
...
Input.defaultProps = {
InputComponent: TextInput,
};
...
// here find it defalut use textinput in react-native,and when disable true,use the disalbeInputStyle
render(){
<View style={StyleSheet.flatten([styles.container, containerStyle])}>
....
<InputComponent
testID="RNE__Input__text-input"
underlineColorAndroid="transparent"
editable={!disabled}
{...patchWebProps(attributes)}
ref={ref => {
this.input = ref;
}}
style={StyleSheet.flatten([
styles.input,
inputStyle,
disabled && styles.disabledInput,
disabled && disabledInputStyle,
])}
/>
...
</View>
}
For the TextInput in react-native, we set the text color used color style
so you can try to do use disabledInputStyle, and set the color you want.
<Input
disabled={true}
value={"ddd"}
disabledInputStyle={{color:'red',opacity:1}} //chanage which color you want
placeholder='INPUT WITH ERROR MESSAGE'
errorStyle={{ color: 'red' }}
errorMessage='ENTER A VALID ERROR HERE'
/>