如何在文本输入中向右移动文本 (React Native)

Question

Hi

我想通过向文本输入添加 边框半径 来设计我的应用程序，我观察到输入中的文本从 角向外延伸如何向右移动

这是文本输入代码

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

Answer 1

您可以向输入添加填充，这将为您提供所需的 space。

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，但这会增加输入的高度

如何在文本输入中向右移动文本 (React Native)

How to move text right in Text Input (React Native)

styling

react-native

react-native-textinput