专栏首页码生StackNavigator in react-navigation 安卓标题 居左 问题

StackNavigator in react-navigation 安卓标题 居左 问题

StackNavigator() 调用的时候第二个参数 中如下设置

navigationOptions: {
              headerBackTitle: null,
              headerBackTitleStyle: {
                  color: 'white',
              },
              headerStyle: {
                  backgroundColor: '#647cff',
              },
              headerTitleStyle: {
                  color: 'white',
                  alignSelf: 'center',
              },
              headerTintColor: 'white',
              headerRight: <View style={{width: 40, height: 1,}}/>,
          }

headerBackTitle: null, 屏蔽所有的导航左上角返回标题 headerBackTitleStyle: { color: 'white', }, 左上角返回标题为白色 headerStyle: { backgroundColor: '#647cff', },统一修改导航背景颜色

而安卓导航标题默认是居左的,比较难看

修改方法是 headerTitleStyle: {alignSelf: 'center',},

如此,标题会居中放置

但是,这么设置还是不行,可以看到标题在中间靠右位置。

因为 左上角 有返回按钮,标题在除了 左上角按钮的 其余剩余空间居中,而右上角什么都没有,导致靠右

最简单的做法就是,右上角放置占位视图

headerRight: <View style={{width: 40, height: 1,}}/>,

默认宽度 40,40和左上角按钮宽度大致一样

就可以使标题完美居中

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • ReactNative 获取屏幕宽高

    onety码生
  • django Authorization token

    原因:没有导入rest authon: 'rest_framework.authtoken', 解决方法:在 settings 里面 INSTALLED_AP...

    onety码生
  • ios 获取属性的类型

    onety码生
  • 【观点】联盟副秘书长陈新河青岛调研分享10大要点

    受青岛经信委之邀,陈新河老师在青岛调研三日,走访了青岛经信委,高新开发区、黄岛开发区等2个开发区,软件协会、物联网协会等2个协会,光谷联合、科创慧谷、软件科技城...

    小莹莹
  • 基于.NET的Java虚拟机IKVM介绍

    ??? ?IKVM的定位是基于.NET CLR的Java虚拟机。 ?这是一个开源的项目,主页地址:IKVM

    田春峰-JCJC错别字检测
  • iOS11后32位应用升级

    今天接受了一个改造旧项目的任务,据说项目唯独在iOS11上无法运行。这很容易就让我们想到与最近苹果iOS11放弃支持32位应用的事件有关。确实我在平时开发的项目...

    梧雨北辰
  • 【STM32F429开发板用户手册】第27章 STM32F429的定时器应用之TIM1-TIM14的PWM实现

    最新教程下载:http://www.armbbs.cn/forum.php?mod=viewthread&tid=93255

    armfly
  • 【STM32F407开发板用户手册】第27章

    最新教程下载:http://www.armbbs.cn/forum.php?mod=viewthread&tid=93255

    armfly
  • 数据库范式与反范式设计,是一门艺术

    在日常业务研发过程中,我们常常需要与数据库表打交道。设计范式是数据表设计的基本原则,对于数据表的设计范式,我们特别容易忽略它的存在。很多时候,当数据库运行了一段...

    架构精进之路
  • 「R」数据可视化8:棒棒图

    首先让我们来看几张棒棒糖图。可以发现实际上就是一根柱子加上一个圆,其实类似传统的柱状图。但是它可以给我们更多的信息,因为圆和下面的棒子可以代表同一组数据,也可以...

    王诗翔呀

作者介绍

onety码生

什马互联网金融信息服务(上海)有限公司iOS高级工程师

什马互联网金融信息服务(上海)有限公司 · iOS高级工程师 (已认证)

专栏

精选专题

活动推荐

扫码关注云+社区

领取腾讯云代金券