将文本与图像对齐 - React Native

Question

我试图将每个图像下的社交图标文本对齐如下：

但是，我得到了这些结果：

我将每一行都放在一个单独的视图中

<View style={styles.socialIcons}>
    <Image source={require("social/facebook-icon.png")} />
    <Image source={require("social/twitter-icon.png")} />
    <Image source={require("social/mail-icon.png")} />
    <Image source={require("social/message-icon.png")} />
</View>
<View style={styles.socialIconsText}>
    <Text style={styles.socialIconText}>Facebook</Text>
    <Text style={styles.socialIconText}>Twitter</Text>
    <Text style={styles.socialIconText}>Email</Text>
    <Text style={styles.socialIconText}>Message</Text>
</View>

后面是他们的风格：

socialIcons: {
    alignItems: 'center',
    flex: 1, 
    flexDirection: 'row', 
    justifyContent: 'space-between',
    paddingLeft: 40,
    paddingRight: 40,
},
socialIconsText: {
    backgroundColor: 'transparent',
    alignItems: 'center',
    flex: 1, 
    flexDirection: 'row', 
    justifyContent: 'space-between',
    paddingLeft: 40,
    paddingRight: 40,
},

我认为我应该做的是将文本放在图像标签内，但是当我这样做时，图像高度会切断其下的任何文本。有没有办法获得图像高度并增加样式的高度？

或者是否有更好的方法来对齐图像下方的文字？