My placeholder is not displaying the Placeholder text. Text input is displayed.
Placeholder text is also displayed while i am running on emulator. But when i install and run the code on my device. It doesnot display any placeholder text.
Here is my code
<View style={styles.root}>
<Text style={styles.title}>Create an account</Text>
<CustomInput
placeholder="Username"
value={userName}
setValue={setUserName}
/>
</View>
Stylesheet looks like this:
const styles = StyleSheet.create({
root: {
alignItems: 'center',
padding: 20
},
title:{
fontSize: 24,
fontWeight: 'bold',
color: '#051c60',
margin:10
}
})
;
Custom Input section looks like this:
<View style={styles.container}>
<TextInput
placeholder={placeholder}
value={value}
onChangeText={setValue}
style={styles.input}
secureTextEntry={secureTextEntry}
/>
</View>
CSS for custom Input
const styles = StyleSheet.create({
container:{
backgroundColor:'white',
width: '100%',
borderColor:'#e8e8e8',
borderWidth:1,
borderRadius:5,
paddingHorizontal:10,
marginVertical:5,
},
input:{
fontSize:16,
color:'#000',
paddingVertical:10,
}
})