微信小程序开发使用（全局配置）

小程序特点：

无需安装，无需卸载，触手可及，用完即走
小程序基于微信，微信基于腾讯，腾讯有庞大的用户基数
小程序的核心技术基于h5 ajax的web app

基于微信公众平台进行小程序的开发：https://mp.weixin.qq.com/

前提：
先注册一个微信小程序账号，进入账号之后可以创建一个小程序

然后进入小程序开发文档，下载小程序开发工具

安装小程序开发者工具，进行小程序的测试开发

创建项目

进入项目开发界面

小程序项目结构：

index.js 脚本文件，负责加载数据，实现部分特效，里面有很多定义好的js方法和 结构用来加载数据。
index.json 配置文件，有很多关于页面的配置
index.wxml 前端页面，拥有独立的标签系统，和HTML神似
index.wxss 样式文件，和css一样

微信小程序的前端样式，每个页面至少三个文件维护
Js,wxml,wxss

但是也有全局配置，开发者可以根据开发需通过修改配置要进行样式的修改

微信全局配置的文档
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html

pages 参数：全局的页面统计列表
用于指定小程序由哪些页面组成，每一项都对应一个页面的 路径（含文件名） 信息。文件名不需要写文件后缀，框架会自动去寻找对于位置的 .json, .js, .wxml, .wxss 四个文件进行处理。

创建一个新页面



打开开发者文档，全局配置，演示效果

window参数：全局默认窗口,用于设置小程序的状态栏、导航条、标题、窗口背景色。

  "window": {
    // 下拉 loading 的样式，仅支持 dark / light
    "backgroundTextStyle": "light",
    // 导航栏背景颜色
    "navigationBarBackgroundColor": "#30A9DE",
    // 导航栏标题文字内容
    "navigationBarTitleText": "襄湘天地",
    // 导航栏标题颜色，仅支持 black / white
    "navigationBarTextStyle": "white"
  },

tabBar参数： 底部导航栏

"tabBar": {
    "color": "#F8FAFF", // tab 上的文字默认颜色
    "selectedColor": "#00b9f1", // tab 上的文字选中时的颜色
    "backgroundColor": "#D499B9", // tab 的背景色
    "list": [ // tab 的列表，详见 list 属性说明，最少 2 个、最多 5 个 tab
      {
        "text": "首页", // tab 上按钮文字
        "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
        "iconPath": "image/index.png", // 图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。
        "selectedIconPath": "image/index_select.png" // 选中时的图片路径
      },
      {
        "text": "列表",
        "pagePath": "pages/list/list",
        "iconPath": "image/list.png",
        "selectedIconPath": "image/list_select.png"
      },
      {
        "text": "个人中心",
        "pagePath": "pages/person/person",
        "iconPath": "image/person.png",
        "selectedIconPath": "image/person_select.png"
      }
    ]
  },

tabBar说明：

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

属性	类型	必填	默认值	描述	最低版本
color	HexColor	是		tab 上的文字默认颜色，仅支持十六进制颜色
selectedColor	HexColor	是		tab 上的文字选中时的颜色，仅支持十六进制颜色
backgroundColor	HexColor	是		tab 的背景色，仅支持十六进制颜色
borderStyle	string	否	black	tabbar 上边框的颜色， 仅支持 black / white
list	Array	是		tab 的列表，详见 list 属性说明，最少 2 个、最多 5 个 tab
position	string	否	bottom	tabBar 的位置，仅支持 bottom / top
custom	boolean	否	false	自定义 tabBar，见详情	2.5.0

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

属性	类型	必填	说明
pagePath	string	是	页面路径，必须在 pages 中先定义
text	string	是	tab 上按钮文字
iconPath	string	否	图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。当 position 为 top 时，不显示 icon。
selectedIconPath	string	否	选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。当 position 为 top 时，不显示 icon。