文本输入:下划线可能比占位符文本长



我希望文本输入下划线占位符比文本长,看起来漂亮整洁。但是,它仅在用户键入更多字母时展开。有没有办法将其设置为默认值?

我遇到的另一个问题是,在我的密码文本输入中,它没有显示所有文本,它只显示 PASSWOR。

这是我的文本输入代码:

<View 
            style={styles.inputContainer}
            >
                {/** USERNAME TEXT INPUT**/}
                <TextInput
                style={styles.usernameInput}
                placeholder= "USERNAME"
                placeholderTextColor='white'
                maxLength= {15}
                autoCorrect={false}
                underlineColorAndroid='blue'
                >
                </TextInput>

                {/** PASSWORD TEXT INPUT**/}
                <TextInput
                style={styles.passwordInput}
                placeholder= "PASSWORD"
                placeholderTextColor='white'
                maxLength= {15}
                autoCorrect={false}
                underlineColorAndroid='blue'
                secureTextEntry={true}
                >
                </TextInput>
            </View>

这是我的样式代码:

const styles = StyleSheet.create({
Container: {
    flex: 1,
    width: null,
    height: null,
    alignItems: 'center',
    justifyContent: 'center',
},
inputContainer: {
    height: '80%',
    width: '80%',
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'rgba(216,69,69,0.8)',
    borderRadius: 50,
},
usernameInput: {
    fontFamily: "Montserrat",
    fontSize: 20,
    color: 'white',
    fontWeight: 'bold',
},
passwordInput: {
    fontFamily: "Montserrat",
    fontSize: 20,
    color: 'white',
    fontWeight: 'bold',
},

你能像这样更改样式表并告诉我结果吗?

Container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
},
inputContainer: {
    height: 120,
    width: 120,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: 'rgba(216,69,69,0.8)',
    borderRadius: 50,
},
usernameInput: {
    fontFamily: "Montserrat",
    width: 120,
    fontSize: 20,
    color: 'white',
    fontWeight: 'bold',
},
passwordInput: {
    fontFamily: "Montserrat",
    fontSize: 20,
    width: 120,
    color: 'white',
    fontWeight: 'bold',
},

相关内容

  • 没有找到相关文章