首页 > 解决方案 > 反应原生对齐图像与文本

问题描述

在 react native 上,我已经用标签 View 包装了图像。代码如下

<View style={{ flexDirection: 'row', marginTop: 3, alignItems:'center' }}>
     <Image source={Images.rank} style={{ width: 20, height: 20 }}></Image>
     <Text style={[mainstyle.textGrey, mainstyle.fs14, mainstyle.ml5,]}>
         {I18n.t('Rank')}: 
         <Text onPress={() => this._goto('Rank')} 
             style={[mainstyle.textRed, mainstyle.fs14, mainstyle.bold, 
                 mainstyle.textUnderline]}>
                     {this.state.monthRank == '' ? 
                         '-' : this.state.monthRank}
         </Text>
      </Text> 
</View>

我如何将文本放在容器的中心并将中心与图像对齐。我们可以看到文字稍微向上 图像与文本不对齐

标签: cssimagereact-nativeuser-interfaceflexbox

解决方案


推荐阅读