如何解决React Native Paper Text Input-在初始状态下调整标签颜色
我想在初始状态(不是onFocus)调整概述的本机纸TextInput标签颜色。这是我的OutlinedInput组件:
import * as React from 'react';
import { TextInput } from 'react-native-paper';
const OutlinedInput = (props) => {
return (
<TextInput
mode='outlined'
label={props.label}
placeholder={props.placeholder}
placeholderTextColor='white'
secureTextEntry={props.secureTextEntry}
multiline={props.multiline}
keyboardType={props.keyboardType}
value={props.value}
onChangeText={(value) => props.onChangeText(value)}
style={props.style}
theme={props.theme}
/>
);
};
export default OutlinedInput;
在我的Register组件中,我在其中创建了OutlinedInput组件:
<View style={{ justifyContent: 'center',alignItems: 'center' }}>
<OutlinedInput
label={'User Name'}
value={userName}
onChangeText={(userName) => setUserName(userName)}
style={{ color: 'white',backgroundColor: 'rgb(35,39,42)',borderRadius: 5,width: '75%',height: '5%'
}}
theme={{ colors: { text: 'white',primary: 'rgb(33,151,186)' } }}
/>
</View>
我将这一行添加到Register组件的顶部:
const [userName,setUserName] = useState('');
我的程序的屏幕快照(如果我不单击输入的话):
这是单击输入的屏幕提示:
如您所见,标签User Name的颜色为黑色。我想将此设置为白色。单击它时,它可以按预期工作,但是标签颜色的初始状态不是我想要的。
我试图使用占位符解决此问题。我将占位符道具添加到OutlinedInput并将占位符颜色更改为白色,但是在这种情况下,占位符没有成为轮廓。当我尝试有关占位符的任何内容时,都没有被概述。
打开程序后如何调整标签颜色使其显示为白色?
解决方法
您需要替换TextInput
属性:
placeholderTextColor='white'
具有:
theme={{
colors: {
placeholder: 'white'
}
}}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。