如何通过app.json对小程序进行全局配置_移动开发平台 mPaaS(mPaaS)-阿里云帮助中心

app.json 用于对小程序进行全局配置，设置页面文件的路径、窗口表现、网络超时时间、多 tab 等。

以下是一个基本配置示例：

{
  "pages": [
    "pages/index/index",
    "pages/logs/index"
  ],
  "window": {
    "defaultTitle": "Demo"
  }
}

完整配置项如下：

属性	类型	是否必填	描述
pages	Array	是	设置页面路径
window	Object	否	设置默认页面的窗口表现
tabBar	Object	否	设置底部 tabbar 的表现

pages

app.json 中的 pages 为数组属性，数组中每一项都是字符串，用于指定小程序的页面。在小程序中新增或删除页面，都需要对 pages 数组进行修改。

pages 数组的每一项代表对应页面的路径信息，其中，第一项代表小程序的首页。

页面路径不需要写任何后缀，框架会自动去加载同名的 .json、.js、.axml、.acss 文件。举例来说，如果开发目录为：

├── pages
│   ├──index
│   │    ├── index.json
│   │    ├── index.js
│   │    ├── index.axml
│   │    └── index.acss
│   ├──logs
│   │    ├── logs.json
│   │    ├── logs.js
│   │    └── logs.axml
├── app.json
├── app.js
└── app.acss

那么 app.json 就要写成：

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ]
}

window

window 用于设置小程序的状态栏、导航条、标题、窗口背景色等。

属性	类型	是否必填	描述
defaultTitle	String	否	页面默认标题
pullRefresh	String	否	是否允许下拉刷新。默认 NO。备注：下拉刷新生效的前提是 `allowsBounceVertical` 值为 YES
allowsBounceVertical	String	否	是否允许向下拉拽。默认 `YES`, 支持 `YES` / `NO`
transparentTitle	String	否	导航栏透明设置。默认 `none`，支持 `always` 一直透明 / `auto` 滑动自适应 / `none` 不透明
titlePenetrate	String	否	是否允许导航栏点击穿透。默认 `NO`，支持 `YES` / `NO`
showTitleLoading	String	否	是否进入时显示导航栏的 loading。默认 `NO`，支持 `YES` / `NO`
titleImage	String	否	导航栏图片地址
titleBarColor	HexColor	否	导航栏背景色
backgroundColor	HexColor	否	下拉露出显示的背景颜色
backgroundImageColor	HexColor	否	下拉露出显示的背景图底色
backgroundImageUrl	String	否	下拉露出显示的背景图链接
gestureBack	String	否	iOS 用，是否支持手势返回。默认 `NO`，支持 `YES` / `NO`
enableScrollBar	Boolean	否	Android 用，是否显示 WebView 滚动条。默认 `YES`，支持 `YES` / `NO`

代码示例：

{
  "window":{
    "defaultTitle": "客户端接口功能演示"
  }
}

tabBar

如果您的小程序是一个多 tab 应用（客户端窗口的底部栏可以切换页面），那么可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页面。

说明：

通过页面跳转（my.navigateTo）或者页面重定向（my.redirectTo）所到达的页面，即使它是定义在 tabBar 配置中的页面，也不会显示底部的 tab 栏。
tabBar 的第一个页面必须是首页。

tabBar 配置项如下：

属性	类型	是否必填	描述
textColor	HexColor	否	文字颜色
selectedColor	HexColor	否	选中文字颜色
backgroundColor	HexColor	否	背景色
items	Array	是	每个 tab 配置

每个 item 配置如下：

属性	类型	是否必填	描述
pagePath	String	是	设置页面路径
name	String	是	名称
icon	String	否	平常图标路径
activeIcon	String	否	高亮图标路径

icon 图标推荐大小为 60×60 px，系统会对传入的非推荐尺寸的图片进行非等比拉伸或缩放。

tabBar 示例如下：

{
  "tabBar": {
    "textColor": "#dddddd",
    "selectedColor": "#49a9ee",
    "backgroundColor": "#ffffff",
    "items": [
      {
        "pagePath": "pages/index/index",
        "name": "首页"
      },
      {
        "pagePath": "pages/logs/logs",
        "name": "日志"
      }
    ]
  }
}