在TextInput字段中防止文本滚动和截断

Question

我的TextInput应用程序中有React-Native个字段，并且在不将行高设置为非常大的情况下，无法使该字段中的文本不滚动和截断文本底部。

这是正在发生的事情的图像：

样式道具如下：

input: {
  height: 28, 
  paddingBottom: 0, 
  fontSize: 18,  
  color: '#000', 
  borderBottomWidth: 1.5,    
},

有没有一种方法可以迫使文本不在TextInput

中移动

Answer 1

Android中的TextInput似乎设置了默认的paddingBottom设置，而iOS没有设置默认值，因为android有下划线标签，而ios没有。每个平台的默认填充不同。

为什么paddingBottom或padding无法正常工作。

请检查以下link

Answer 2

删除静态高度并设置paddingVertical : 7也使用includeFontPadding:false

这里有7个示例，您可以根据自己的选择进行设置。

样本样式

textInput: {
    borderWidth: 1,
    borderColor: colors.borderColor,
    color: colors.fontPrimary,
    fontSize: 16,
    paddingLeft: 16,
    includeFontPadding:false,
    backgroundColor: colors.white,
    marginHorizontal: 16,
    borderRadius: 5,
    paddingVertical:7,
  }

Answer 3

请从样式中删除高度道具

input: {
  paddingBottom: 0, 
  fontSize: 18,  
  color: '#000', 
  borderBottomWidth: 1.5,    
},

我认为它将为您提供帮助

如果要设置，请至少设置40

Answer 4

下面的代码解决了我的问题。

{
  includeFontPadding:false,
  padding: 0,
  margin: 0,
}

希望它对你有用。