TextInput: подчеркивание возможно быть длиннее текста заполнителя?

Question

Я хочу, чтобы заполнитель подчеркивания для ввода текста был длиннее, чем текст, чтобы он выглядел красиво и аккуратно.Однако он расширяется только тогда, когда пользователь печатает больше букв.Есть ли способ установить его дольше по умолчанию?

Еще одна проблема, с которой я сталкиваюсь, заключается в том, что в моем текстовом вводе пароля он не отображает весь текст, а только ПАРОЛЬ.

вот мои текстовые коды ввода:

<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',
},

Answer 1

Можете ли вы изменить таблицу стилей, как это и сказать мне результат?

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',
},