Small micro-channel program: development of entry of the configuration file (app.json) (b)

Following the "micro-channel applet: Getting started with the development of the profile (app.json) (a)" spoke configuration file (app.json) in the configuration pages and windows, today as we then sort out abBar, networkTimeout, debug configuration

tabBar Configuration

When you need a menu bar at the top or bottom of the program, we can quickly achieve through configuration tabBar, tabBar is an optional item. Configurable attributes are as follows:

  • color: the color of the text on the tab default, the value HexColor (hexadecimal color values), are required.

  • selectedColor: color when the text on the tab selected, the value of HexColor (hexadecimal color values), are required.

  • backgroundColor: tab background color, value HexColor (hexadecimal color values), are required.

  • borderStyle: color of the border on the tabbar, supports only black / white, default is black.

  • List: a list tab, required, a value of an array, at least two, up to 5 tab, each item in the array is an object that represents a configuration of the tab, each of the following configuration:

  • pagePath: Page path, you must first define the pages in required. · Text: Text button on the tab, required.

  • iconPath: relative path on the tab icon image, icon size limit of 40kb, required.

  • selectedIconPath: Selected when the picture relative path, icon size limit of 40kb, required.

  • position: tab at the top or bottom of the display, is optional bottom, top, default is bottom.

    See the sample code in Listing 2-1.

    Listing 2-1 app.json

{
  "pages" : [
    "mypages/index/index",
    "mypages/list/list"
  ],
  "tabBar" : {
    "color" : "#000000",
    "selectedColor" : "#ff7f50",
    "backgroundColor" : "#ffffff",
    "borderStyle" : "black",
    "list" : [
      {
        "iconPath" : "images/home.png",
        "selectedIconPath" : "images/home-selected.png",
        "pagePath" : "mypages/index/index",
        "text" : "首页"
      },
      {
        "iconPath" : "images/search.png",
        "selectedIconPath" : "images/search-selected.png","pagePath" : "mypages/list/list",
        "text" : "搜索"
      },
      {
        "iconPath" : "images/list.png",
        "selectedIconPath" : "images/list-selected.png",
        "pagePath" : "mypages/list/list",
        "text" : "列表"
      }
    ],
    "borderStyle" : "bottom"
  }
}

After configuring the results page shown in Figure 2-6.
Here Insert Picture Description
networkTimeout Configuration

Applet various network request time set by the unified API NetworkTimeout only, not separately provided in the API, request a specific network API can refer to the following chapters, NetworkTimeout Supported attributes are:

  • request: Set wx.request timeout milliseconds.

  • connectSocket: Set wx.connectSocket timeout milliseconds.

  • uploadFile: Set wx.uploadFile timeout milliseconds.

  • downloadFile: Set wx.downloadFile timeout milliseconds.

    Sample code is as follows:

{
  "pages" : [
    "mypages/index/index"
  ],
  "networkTimeout" : {
    "request" : 60000,
    "connectSocket" : 60000 
    }
}

debug configuration

This configuration item control is turned on debug mode is off by default. After opening debug mode, the control panel developer tools, the debug information output in the form of info, shown in Figure 2-7. Page information which have registered, page routing, data updates, event triggers, can help developers quickly locate some common issues.

Here Insert Picture Description

Sample code is as follows:

{
  "pages" : [
    "mypages/index/index",
    "mypages/list/list"
  ],
  "debug" : true
}

The above is app.json 5 class configuration items, these items are global configuration applet in addition to app.json this global configuration file as well as the profile page, when a route to the corresponding page, configuration page of the configuration file item will override the global configuration, the profile page will be detailed in the subsequent content.

In this article from the book "small micro-channel program: development of entry and case explanation"

Here Insert Picture Description

The book has been added to the VIP membership card, as long as the purchase of VIP membership card to receive free reading hundreds of e-books, in addition to this free VIP cards let you read, there is more interest in waiting for you to lead, pull down ↓
Here Insert Picture Description

The method of reading e-books are as follows:

Open CSDN APP (software store search "CSDN" to find Oh) -> Login CSDN account -> Learning -> e-book

Here Insert Picture Description

Published 16 original articles · won praise 48 · views 20000 +

Guess you like

Origin blog.csdn.net/weixin_37649168/article/details/104377274