在React Native中从图标的顶部和底部删除空格

Question

我正在尝试在项目中包含react-native-vector-icons中的一些图标。我经常将图标与输入，因此我希望它的高度相同（或至少更小），这样我就可以将其在flex行中的输入前面居中，而无需增加行的大小。但是，如果我将图标的大小设置为输入的字体大小，则图标的大小会太小。如果我增加图标的大小，则可以拉伸弹性框，但这显然是不必要的，因为图标的顶部和底部都有很多空格。这是一个示例屏幕截图：

有什么办法可以修剪？图标应为正方形。这是我目前在该屏幕上显示的代码：

import React, {Component} from 'react';
import {View} from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons';

export default class App extends Component {
  render() {
    return (
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: 'white'}}>
        <Ionicons name='ios-checkmark' size={30} />
      </View>
    );
  }
}