用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 查看内容

微信小程序教程:app配置指南

天下雪 2016-10-13 17:20

//app.json页面{//页面注册,有几个页面都要在pages里面注册"pages":,//上导航配置及app背景颜色设置"window":{//是否开启下拉刷新"enablePullDownRefresh":true,//窗口背景颜色,在上拉刷新,下拉刷新,navigate切 ...

//app.json页面

 

{

//页面注册,有几个页面都要在pages里面注册

"pages":[

"pages/index/index",

"pages/logs/logs",

"pages/main/main",

"pages/main1/main1",

"pages/main2/main2",

"pages/main3/main3",

],

//上导航配置及app背景颜色设置

"window":{

//是否开启下拉刷新

"enablePullDownRefresh":true,

//窗口背景颜色,在上拉刷新,下拉刷新,navigate切换页面时可以看见

"backgroundColor":"#eee",

//下拉背景字体、loading 图的样式,仅支持 dark/light,(string形式)

"backgroundTextStyle":"light",

//上导航条背景颜色

"navigationBarBackgroundColor": "orange",

//上导航标题文字

"navigationBarTitleText": "上导航标题文字",

"navigationBarTextStyle":"white" //上导航标题字体颜色,仅支持white和black 

},

//底部导航配置

"tabBar": {

"color": "#a9b7b7",//导航字体默认颜色

"selectedColor": "#eb4f38",//导航字体选中时颜色

"borderStyle": "black", //上border颜色,仅支持 black/white(string形式)

"backgroundColor": "rgba(0,0,0,0.4)",//底部导航背景色

"list": [ //导航列表2-5个

{

"pagePath": "pages/index1/index1", //每个导航的网页对应的路径

"text": "首页", //标题

"iconPath": "images/wechat.png", //默认小图标路径

"selectedIconPath": "images/wechatHL.png" //选中时的小图标路径

},

{

"pagePath": "pages/index2/index2",

"text": "日记",

"iconPath": "images/pause.png",

"selectedIconPath": "images/play.png"

},

{

"pagePath": "pages/index3/index3",

"text": "指南",

"iconPath": "images/pause.png",

"selectedIconPath": "images/play.png"

},


]

},

//网络请求超时时间

"networkTimeout": {

"request": 10000,

"downloadFile": 9000,

"uploadFile":8000,

"connectSocket":7000

},

//是否开启debug模式

"debug": true

}

//说明:根据官方文档,上述color和bg-color类型为HexColor即16进制类型,(指定仅支持 black/white,string形式的除外),但实测rbg,rgba和red这些类型目前也支持,但是建议大家还是按文档要求来设置为16进制类型即: #ffffff 类型;

//

//使用时仅需将文件复制下来,根据需求改动即可;

//

//app.json为标准的json文件,所以不能存在有注释,使用的时候需把注释去掉;

 

  

//app.js页面

App({

//当小程序初始化完成时,会触发 onLaunch(全局只触发一次)

onLaunch: function () {

//onLaunch时调用API从本地缓存中获取数据

var logs = wx.getStorageSync('logs') || []

logs.unshift(Date.now())

wx.setStorageSync('logs', logs)

},

//获取用户登录信息

getUserInfo:function(cb){

var that = this

if(this.globalData.userInfo){

typeof cb == "function" && cb(this.globalData.userInfo)

}else{

//调用登录接口

wx.login({

success: function () {

wx.getUserInfo({

success: function (res) {

that.globalData.userInfo = res.userInfo

typeof cb == "function" && cb(that.globalData.userInfo)

}

})

}

})

}

},

//获取后台数据

onshow:function(){

wx.request({

url: 'test.php',

data: {

x: 'xxx',

y: 'yyy'

},

header: {

'Content-Type': 'application/json'

},

success: function(res) {

console.log(res.data)

}

})

},

//设置全局数据

//本页面通过this.globalData即可取得数据 

globalData:{

userInfo:null

}

//其他页面可以通过getApp()获取到小程序实例 

//其他页面可以通过getApp().globalData.xxx获取到全局数据

})

 

 

//app.wxss页面

.common {

height: 100%;

display: flex;

flex-direction: column;

align-items: center;

justify-content: space-between;

padding: 200rpx 0;

box-sizing: border-box;

}

//仅支持:

类:.common

ID:#common

标签:common

多个标签:common1,common2 

伪类::after

伪类::before

//不支持层级,如.common > view 或者.common view


//引入新的单位rpx:

rpx(responsive pixel): 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。

及新的rem:

rem(root em): 规定屏幕宽度为20rem;1rem = (750/20)rpx 。


//写在app.wxss里面的样式将被设置为公有的,对于其他页面都是可用的

鲜花
鲜花
鸡蛋
鸡蛋
分享至 : QQ空间
收藏
原作者: Runlin 来自: cnblog