微信小程序自定义头部导航栏和背景颜色

易之晓晓

于 2019-01-15 19:40:14 发布

阅读量2.3w

点赞数 4

CC 4.0 BY-SA版权

文章标签： MPVUE

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/qq_42306443/article/details/86498076

在微信小程序中，通过app.json文件的navigationBarBackgroundColor属性可以设置导航栏颜色，但仅限十六进制颜色码。要实现更自定义的导航栏样式，如隐藏顶部导航并保留胶囊按钮，需设置navigationStyle为custom。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在微信小程序中，自定义导航栏的颜色可以在app.json. window里面添加navigationBarBackgroundColor属性。

但是颜色只能为十六进制颜色码，不能使用rgb，或者rgba.。

为了满足更多用户的需求，微信官方给出了一个navigationStyle属性。

官方文档：navigationStyle 导航栏样式，仅支持 default/custom。custom 模式可自定义导航栏，只保留右上角胶囊状的按钮)。

在app.json window 增加 navigationStyle:custom ，顶部导航栏就会消失，保留右上角胶囊状的按钮，如下图所示

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。