微信小程序自定义顶部导航栏,添加背景图,透明色等

在微信小程序中，导航栏的颜色可以在app.json.  window里面添加navigationBarBackgroundColor属性,但是颜色只能为纯色.不能使用rgb,或者rgba的色号. 

但是这样并不能满足很多人的要求.微信官方给出了一个属性,navigationStyle, (导航栏样式，仅支持 default/custom。custom模式可自定义导航栏，只保留右上角胶囊状的按钮),如果在app.json里面的window增加navigationStyle:custom ,顶部导航栏就会消失,保留右上角胶囊状的按钮.如下图所示

然后只需要在wxml文件里面用view标签写出样式即可. 如下图所示

顶部样式只需要在app.wxss文件写出即可.这里注意的是, 页面自带的返回按钮也会消失,需要自己写