在微信小程序中,自定义导航栏的颜色 可以在app.json. window里面添加navigationBarBackgroundColor属性。
但是颜色只能为十六进制颜色码,不能使用rgb,或者rgba.。
为了满足更多用户的需求,微信官方给出了一个navigationStyle属性。
官方文档:navigationStyle 导航栏样式,仅支持 default/custom。custom 模式可自定义导航栏,只保留右上角胶囊状的按钮)。
在app.json window 增加 navigationStyle:custom ,顶部导航栏就会消失,保留右上角胶囊状的按钮,如下图所示。
Q:如果改变胶囊体颜色?
A:胶囊体目前只支持黑色和白色两种颜色 在app.josn window 加上 "navigationBarTextStyle":"white/black"
注:如果自定义导航栏,页面自带的返回按钮也会消失,需要用代码编写