【问题标题】:How to move text right in Text Input (React Native)如何在文本输入中向右移动文本(React Native)
【发布时间】:2022-01-20 23:39:22
【问题描述】:

我想通过将 border radius 添加到文本输入来设置我的应用程序的样式,我观察到输入中的文本超出了 corners 我该怎么做向右移动。

这是文本输入代码

<TextInput
    placeholder="Username"
    placeholderTextColor="rgba(0,0,0,0.6)"
    maxLength={35}
    style={styles.input}
/>

这是样式代码

input: {
    backgroundColor: '#ccc',
    height: 50,
    width: 320,
    alignSelf: 'center',
    borderRadius: 50,
    textAlign: 'left',
    marginTop: 35,

    fontSize: 18,
    fontFamily: 'oswald',
    fontStyle: 'bold',
    color: 'black',
  }

【问题讨论】:

    标签: react-native styling react-native-textinput


    【解决方案1】:

    您可以在输入中添加填充,这将为您提供所需的空间。

    input: {
        paddingHorizontal: 5px,
        backgroundColor: '#ccc',
        height: 50,
        width: 320,
        alignSelf: 'center',
        borderRadius: 50,
        textAlign: 'left',
        marginTop: 35,
    
        fontSize: 18,
        fontFamily: 'oswald',
        fontStyle: 'bold',
        color: 'black',
      }
    

    您也可以只使用填充而不是 paddingHorizontal,但这会增加输入的高度

    【讨论】:

    • 谢谢@Thales_Kenne
    • 我的荣幸!如果这对您有帮助,请接受答案。
    猜你喜欢
    • 2015-08-13
    • 2019-06-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-01-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多