uni-app page.json标题栏的配置

1 底部标题栏

如下图（我的底图是网上淘的嘿嘿）

底部导航栏的设置是tabBar。

注意一下，

1）其中list的内容就是底部的有几个按钮。相关可以在uniapp的官网上搜索tabBar，具体使用都有介绍。

2）其中pagePath的路径画面是点击“我的”导航显示的“我的”画面，这个画面的路径必须在page.json中的pages中引入。

3）pages - style 中的navigationBarTitleText属性，如果设置了，对应画面的标题是显示设置的文字，而不是globalStyle中设置的标题文字。

4）globalStyle设置内容是全部画面的设置。如果需要不同的画面，需要在pages中重新区分

-----                              -----                              -------

{
	"pages": [
		{
			"path": "pages/index/index",
			"style": {
				// "navigationBarTitleText": ""
			}
		}
		,{
			"path": "pages/my/myindex",
			"style": {
				// "navigationBarTitleText": "我的",
				"enablePullDownRefresh": false //控制是否下拉刷新（globalStyle中的下拉刷新方案）
			}
		}
		,{
			"path": "pages/list/listindex",
			"style": {
				"navigationBarTitleText": "产品列表",
				"enablePullDownRefresh": true
			}
		}
	], 
	//用于设置应用的状态栏、导航条、标题、窗口背景色等。
	"globalStyle": {
		"navigationBarTextStyle": "black",//导航栏标题颜色及状态栏前景颜色，仅支持 black/white
		"navigationBarTitleText": "xxxxx2",//导航栏标题文字内容
		"navigationBarBackgroundColor": "#F8F8F8",//导航栏背景颜色（同状态栏背景色）
		"backgroundColor": "#F8F8F8",//下拉显示出来的窗口的背景色	
		"backgroundTextStyle": "dark", //下拉 loading 的样式，仅支持 dark / light
		"enablePullDownRefresh": true, //是否开启刷新
		"onReachBottomDistance" : 50,//页面上拉触底事件触发时距页面底部距离，单位只支持px
		//配置编译到 App 平台时的特定样式，部分常用配置 H5 平台也支持
		"app-plus": {
			"background": "#efeff4"
		}
	},
	"tabBar": {
		"color": "#7A7E83",
		"selectedColor": "#3cc51f",
		"borderStyle": "black",
		"backgroundColor": "#ffffff",//#ffffff
		"height": "50px",
		"fontSize": "10px",
		"iconWidth": "24px",
		"spacing": "3px",
		"iconfontSrc":"static/iconfont.ttf", // app tabbar 字体.ttf文件路径 app 3.4.4+
		"list": [
			{
				"pagePath": "pages/index/index",//页面路径，必须在 pages 中先定义
				"iconPath": "static/tabbar/shouye.png",//图片路径，icon 大小限制为40kb建议尺寸为 81px * 81px，当 position 为 top 时，此参数无效，不支持网络图片，不支持字体图标
				"selectedIconPath": "static/tabbar/shouye-ok.png",//选中时的图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px ，当 position 为 top 时，此参数无效
				"text": "首页"
			}, {
				"pagePath": "pages/list/listindex",
				"iconPath": "static/tabbar/list.png",
				"selectedIconPath": "static/tabbar/list-ok.png",
				"text": "列表"
			}, {
				"pagePath": "pages/my/myindex",
				"iconPath": "static/tabbar/my.png",
				"selectedIconPath": "static/tabbar/my-ok.png",
				"text": "我的"
			}
		]
		// ,
		//midButton：中间按钮突出。小程序不支持
		// "midButton": {
		// 	"width": "100px",
		// 	"height": "100px",
		// 	"text": "扫一扫",
		// 	"iconPath": "static/tabbar/midButton.png",
		// 	"iconWidth": "100px",
		// 	"backgroundImage": "static/tabbar/midButton.png"
		// }
	}
}