LoginSignup
1
0

More than 3 years have passed since last update.

@YukiOmori

【React Native】TextInputでAndoirdのみ縦方向の中央寄せができない

Last updated at Posted at 2020-09-09

前提

  • React Native 0.62.2

問題

  • TextInputコンポーネントでカスタムフォントを適用した際、Androidのみ入力したテキストの下方に謎のpaddingが出現する

↓左がiOS、右がAndroid
※わかりやすくするため、TextInputの背景をグレーにしている。
image.png

解決方法

  • TextInputのstyleに includeFontPadding: false を追加する
    image.png

  • ちなみに、色々調べると、多かったのは以下のパターンのいずれかの組み合わせだが、いずれもうまくいかなかった。

style = {
  padding:0,
  paddingVertical: 0,
  margin: 0,
  textAlignVertical: 'center',
}

参考文献

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
1
0