全局配置

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html
小程序根目录下的 app.json 文件用来对微信小程序进行全局配置。文件内容为一个 JSON 对象，有以下属性：

配置项大全

pages

路径列表，之前介绍过。

window

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

默认app.json中的window：

  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "Weixin",
    "navigationBarTextStyle": "black"
  },

navigationBarBackgroundColor

• 导航栏的背景颜色

navigationBarTitleText

• 标题内容

navigationBarTextStyle

• 导航栏标题字体颜色

enablePullDownRefresh

是否允许下拉刷新

注意

下拉刷新一般不是配置在全局中，因为有些页面面，比如首页，不需要下拉刷新，所以一般都是配置在个别页面中

backgroundTextStyle

• 下拉式loading颜色，上图中为黑色

backgroundColor

窗口的背景色，不是指整个页面的背景色，因为所有内容都是在page标签下，所以平时是看不见背景色，只有在下来刷新时可以看见。

tabBar(关键)

底部的菜单栏。

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

其中 list 接受一个数组，只能配置最少 2 个、最多 5 个 tab。tab 按数组的顺序排序，每个项都是一个对象，其属性值如下：

实践

app.json：

  "tabBar": {
    "list":[
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },{
        "pagePath": "pages/demo/demo",
        "text": "案例"
      }
    ]
  },

底部有菜单栏出现。

接着配置其他参数:

  "tabBar": {
    "color": "#c30",
    "selectedColor": "#0af",
    "backgroundColor": "#cc0",
    "borderStyle": "black",
    "position": "top",
    "list":[
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },{
        "pagePath": "pages/demo/demo",
        "text": "案例"
      },{
        "pagePath": "pages/logs/logs",
        "text": "日志"
      }
    ]
  },

配置list

对list修改:

    "list":[
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath":"images/home.png",
        "selectedIconPath": "images/home_opened.png"
      },{
        "pagePath": "pages/demo/demo",
        "text": "案例",
        "iconPath":"images/list.png",
        "selectedIconPath": "images/list_opened.png"
      },{
        "pagePath": "pages/logs/logs",
        "text": "日志",
        "iconPath":"images/user.png",
        "selectedIconPath": "images/user_opened.png"
      }
    ]

pagePath

导航路径

text

导航标题

iconPath

导航图标（未被选中）

selectedIconPath

被选中时导航图标

单页面配置

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html
和全局配置类似，想修改哪个页面就去该页面下的json中配置，配置只针对该页面有效。