React Native Center对齐正文标题文本

myTest532 myTest532

如何在本机库中居中放置标题文本?

<Header>
  <Left style={{flex:1}}>
    <Button
       transparent
       onPress={() => NavigationService.navigate('Home')}
    >
      <Icon name='arrow-back' />
    </Button>
    </Left>
    <Body style={{flex:1}}>
      <Title>Vacancy Snapshot</Title>
    </Body>
</Header>

上面的结果是文本右对齐。在此处输入图片说明如果我在“<Right style={{flex:1}} />正文”之后添加“右”标签,它将使文本居中,但不会显示整个文本:在此处输入图片说明

肯米斯特里

通过包含<Right style={{flex:1}}/>,标题文本将居中。并增加flex31以便可以显示文本的全长,如下所示:

<Header>
  <Left style={{flex:1}}>
    <Button
      transparent
    >
      <Icon name='arrow-back' />
    </Button>
    </Left>
    <Body style={{flex:3}}>
      <Title>Vacancy Snapshot</Title>
    </Body>
    <Right style={{flex:1}}/>
</Header>

我还在这里提供了一个世博会小吃以供进一步实验。玩得开心!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章