小程序安卓和 IOS 导航栏标题一个默认居左一个默认居右

295 阅读1分钟

其实这不算是一个很严重的问题,不过还是可以研究一下。

出现原因

系统差异。

解决方法

1. 自定义导航栏

但这个方法很麻烦,需要手写导航栏

2.标题前面加中文空格

这个方法很怪,是我在微信社区看到的,我试了一下,安卓真机标题真的从居左变为居中了,IOS 没试。

要注意的是,加的是中文空格,不是英文的,英文的不起作用。

文档配置

看都看了,顺便了解一下官方文档的配置,以下是和导航栏标题相关的配置:

属性类型默认值描述最低版本
navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如 #000000
navigationBarTextStylestringwhite导航栏标题颜色,仅支持 black / white
navigationBarTitleTextstring导航栏标题文字内容
navigationStylestringdefault导航栏样式,仅支持以下值: default 默认样式 custom 自定义导航栏,只保留右上角胶囊按钮。iOS/Android 微信客户端 7.0.0,Windows 微信客户端不支持

可以看到是没有地方能够配置文字居左还是居中的。

第四个属性navigationStyle一开始我没理解什么意思,试了一下才知道。

首先这个属性支持的值只有defaultcustom

default这个值应该也是默认值,当设置为这个值的时候,就显示我们通过title设置的导航栏; 当设置为custom的时候,整个导航栏就只显示下面图片这里,之前定义的标题文字都是不显示的。

image.png

因此,如果不需要导航栏或者想要自定义导航栏,就可以使用这个值。

refer:

  1. developers.weixin.qq.com/community/d…
  2. developers.weixin.qq.com/miniprogram…