在 Android 上更改高度时，react-native TextInput 显示错误

Question

我有一个具有以下样式的 TextInput：

amountInput: {
  flex: 1,
  backgroundColor: 'rgba(255, 255, 255, 0.1)',
  color: 'rgba(255, 255, 255, 0.9)',
},

在 iOS 上，它看起来好像没有足够的填充：

在 Android 上，默认情况下有巨大的填充：

没问题 - 我将设置左右填充和高度：

amountInput: {
  flex: 1,
  backgroundColor: 'rgba(255, 255, 255, 0.1)',
  height: 30,
  paddingRight: 5,
  paddingLeft: 5,
  color: 'rgba(255, 255, 255, 0.9)',
}

在 iOS 上看起来不错：

但是 Android 搞砸了：

如何制作像倒数第二个 iOS 屏幕截图一样的 Android 输入框？ 谢谢。

Answer 1

Android 在顶部和底部添加了一些默认填充，您可以通过将paddingVertical: 0添加到元素的样式来重置它们。

Answer 2

对我来说，这是 Android 中的文本对齐问题。 将textAlignVertical: 'top'添加到样式中为我修复了它。

Answer 3

使文本输入在 iOS 和 Android 上看起来相同。 给它一个特定的高度，这将覆盖 android 中的默认高度。