React Native Android Text Component дополнительное дополнение

Мне было интересно, почему я получаю эти странные padding в моем тексте в реагирующем родном. Я перепробовал все, чтобы получить идеальный текст, но, похоже, ничто не сработало, единственное, что сработало, это paddingVertical и paddingHorizontal но это слишком глупо и не надежно.

<Text numberOfLines={1} 
      style={{
            backgroundColor: 'red', 
            lineHeight: 92, 
            textAlign: 'center', 
            textAlignVertical: 'center', 
            padding: 0, 
            margin: 0, 
            fontSize: 92,  
            color: '#2d76ff', 
            fontFamily: 'Roboto-Regular', 
            includeFontPadding: false}}>
      {this.state.documents}
</Text>

Zeplin

enter image description here

Скриншот из моего HTC

enter image description here

Ответы

Ответ 1

Я наткнулся на эту проблему, потому что я испытывал то же самое. У текстового компонента есть реквизит, называемый includeFontPadding. Вы можете установить его в false, чтобы удалить лишние отступы.

Проверьте React Native Docs для справки: https://facebook.github.io/react-native/docs/text-style-props#includefontpadding

Ответ 2

Вы можете добавить в стиль:

lineHeight: 70,
paddingTop: -6,

И это результат: result.