全局配置之状态栏与导航栏

全局配置设置在项目根目录下的pages.json文件中。globalStyle用于设置应用的状态栏、导航条、标题、窗口背景色等，这里列举关于状态栏和导航栏的常用属性，官方文档 (opens new window)

属性	类型	默认值	描述	平台差异说明
navigationBarBackgroundColor	HexColor	#F7F7F7	导航栏背景颜色（同状态栏背景色）	APP与H5为#F7F7F7，小程序平台请参考相应小程序文档
navigationBarTextStyle	String	white	导航栏标题颜色及状态栏前景颜色，仅支持 black/white
navigationBarTitleText	String		导航栏标题文字内容
titleImage	String		导航栏图片地址（替换当前文字标题），支付宝小程序内必须使用https的图片链接地址	支付宝小程序、H5、APP
transparentTitle	String	none	导航栏整体（前景、背景）透明设置。支持 always 一直透明 / auto 滑动自适应 / none 不透明	支付宝小程序、H5、APP
titlePenetrate	String	NO	导航栏点击穿透	支付宝小程序、H5
navigationStyle	String	default	导航栏样式，仅支持 default/custom。custom即取消默认的原生导航栏，需看使用注意 (opens new window)	微信小程序 7.0+、百度小程序、H5、App（2.0.3+）

参考配置如下

{
    //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
	"pages": [ 
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "uni-app"
			}
		}
	],
	"globalStyle": {
        // 状态栏与导航栏背景颜色
		"navigationBarBackgroundColor": "#F8F8F8",
        // 状态栏与导航栏字体颜色仅支持 black/white(默认)
        "navigationBarTextStyle": "black",
        // 导航栏标题文字
		"navigationBarTitleText": "星空小屋",
        // 导航栏图片地址（替换导航栏标题文字）
        "titleImage": "/static/logo.png",
        // 导航栏样式，仅支持 default/custom, custom不显示原生导航栏，状态栏也不占位
        "navigationStyle": "default"
	}
}

bounce 上拉下拉回弹

属性	类型	默认值	描述	平台差异说明
backgroundColorTop	HexColor	#ffffff	顶部窗口的背景色（bounce回弹区域）	仅 iOS 平台
backgroundColorBottom	HexColor	#ffffff	底部窗口的背景色（bounce回弹区域）	仅 iOS 平台
backgroundColor	HexColor	#ffffff	下拉显示出来的窗口的背景色	微信小程序

ios平台有回弹效果，微信小程序则是下拉显示出来的窗口背景色，也有动画效果，参考配置：

"globalStyle": {
    // 上拉下拉回弹背景色（微信小程序）
    "backgroundColor": "#e42863",
    // 下拉顶部回弹背景色（ios）
    "backgroundColorTop": "#000",
    // 上拉底部回弹背景色（ios）
    "backgroundColorBottom": "#345DC2"
}