React Native Expo自定义Text Input：iOS垂直对齐正常，Android异常

• 清除Android默认内边距：Android系统的TextInput组件自带上下内边距，这是导致占位符偏移的常见原因。可以通过平台差异化样式强制移除默认内边距：

  const inputStyles = StyleSheet.create({
    container: {
      height: 44, // 统一设置组件高度
    },
    input: {
      flex: 1,
      ...Platform.select({
        android: {
          paddingVertical: 0, // 覆盖Android默认内边距
        },
      }),
    },
  });
  

• 统一行高与组件高度：iOS和Android对lineHeight的渲染逻辑不同，如果设置了固定行高，容易出现错位。建议让行高和组件高度保持一致，或者针对Android单独调整：

  const inputStyles = StyleSheet.create({
    input: {
      height: 44,
      lineHeight: Platform.OS === 'android' ? 44 : 42, // 根据平台微调行高
    },
  });
  

• 单独控制占位符样式：部分场景下，需要通过占位符的专属样式来对齐。如果使用React Native，可以借助UI库提供的placeholderStyle属性，或者通过调整整体输入框样式间接对齐占位符，确保垂直方向没有额外间距。

• 避免自适应高度：如果输入框高度设为自适应，Android会因字体渲染差异导致高度波动，进而影响占位符对齐。建议设置固定的height值，保证两端组件尺寸一致。

内容的提问来源于stack exchange，提问作者user14263509