手册

目录

绘图
微信小程序API 绘图接口(reference)、方法大全 微信小程序API 绘图 微信小程序API 绘图介绍(如何在Canvas上画图) 微信小程序API coordinates(Canvas 坐标系) 微信小程序API gradient(如何绘制渐变效果) 微信小程序API wx.createCanvasContext(canvasId)(绘图上下文) 微信小程序API 绘图·绘制画布 drawCanvas (不推荐使用) 微信小程序API 绘图·导出图片canvasToTempFilePath(OBJECT) 微信小程序API 绘图·设置填充样式setFillStyle 微信小程序API 绘图setStrokeStyle(设置线条样式) 微信小程序API 绘图setShadow(设置阴影样式) 微信小程序API 绘图createLinearGradient(创建线性渐变) 微信小程序API 绘图createCircularGradient(创建圆形渐变) 微信小程序API绘图addColorStop(创建颜色渐变点) 微信小程序API 绘图setLineCap(设置线条端点样式) 微信小程序API 绘图setLineJoin(设置线条交点样式) 微信小程序API 绘图setMiterLimit(设置最大倾斜) 微信小程序API 绘图rect创建矩形 微信小程序API 绘图fillRect(填充矩形) 微信小程序API 绘图strokeRect(画一个矩形,非填充) 微信小程序API 绘图clearRect(在给定的矩形区域内,清除画布上的像素) 微信小程序API 绘图fill(对当前路径进行填充) 微信小程序API 绘图stroke(对当前路径进行描边) 微信小程序API 绘图beginPath(开始一个路径) 微信小程序API 绘图closePath(关闭一个路径) 微信小程序使用moveTo把路径移动到画布中的指定点,不创建线条 微信小程序中使用lineTo方法增加一个新点 使用arc()方法在微信小程序canvas中画弧线 在微信小程序绘图API中创建二次方贝塞尔曲线 在微信小程序API绘图中创建三次方贝塞尔曲线路径 在微信小程序中调用scale方法对横纵坐标进行缩放 微信小程序API 绘图对坐标轴进行顺时针旋转 微信小程序canvas中使用translate对坐标原点进行缩放 微信小程序API 绘图setFontSize(设置字号) 微信小程序绘图API中使用fillText在画布上绘制被填充的文本 微信小程序API中,使用drawImage完成绘制图像,图像保持原始尺寸 微信小程序API 绘图中使用setGlobalAlpha设置全局画笔透明度 微信小程序save/restore(保存和恢复绘图上下文) 微信小程序API 绘图·draw(进行绘图) 微信小程序API 绘图·getActions(不推荐使用) 微信小程序API 绘图·clearActions (不推荐使用) 微信小程序API 其他 微信小程序API 下拉刷新

小程序配置

收藏188

阅读91108

更新时间2022-04-11

配置


我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。

以下是一个包含了所有配置选项的简单配置app.json

{
  "pages": [
    "pages/index/index",
    "pages/logs/index"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "日志"
    }]
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true
}

app.json 配置项列表

QQ截图20170208095320.png

pages

接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成。每一项代表对应页面的【路径+文件名】信息,数组的第一项代表小程序的初始页面。小程序中新增/减少页面,都需要对 pages 数组进行修改。

文件名不需要写文件后缀,因为框架会自动去寻找路径.json,.js,.wxml,.wxss的四个文件进行整合。

如开发目录为:

pages/

pages/index/index.wxml

pages/index/index.js

pages/index/index.wxss

pages/logs/logs.wxml

pages/logs/logs.js

app.js

app.json

app.wxss

则,我们需要在 app.json 中写

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

window

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

QQ截图20170208095335.png

注:HexColor(十六进制颜色值),如"#ff00ff"

如 app.json :

{  "window":{    "navigationBarBackgroundColor": "#ffffff",    "navigationBarTextStyle": "black",    "navigationBarTitleText": "微信接口功能演示",    "backgroundColor": "#eeeeee",    "backgroundTextStyle": "light"
  }
}

201609231432565561.jpg

tabBar

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

tabBar 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序。

属性说明:

QQ截图20170208095352.png

其中 list 接受一个数组,数组中的每个项都是一个对象,其属性值如下:

QQ截图20170208095414.png

2.png

networkTimeout

可以设置各种网络请求的超时时间。

属性说明:

QQ截图20170208095446.png

debug

可以在开发者工具中开启 debug 模式,在开发者工具的控制台面板,调试信息以 info 的形式给出,其信息有Page的注册页面路由数据更新事件触发 。 可以帮助开发者快速定位一些常见的问题。

page.json

每一个小程序页面也可以使用.json文件来对本页面的窗口表现进行配置。    页面的配置比app.json全局配置简单得多,只是设置 app.json 中的 window 配置项的内容,页面中配置项会覆盖 app.json 的 window 中相同的配置项。

页面的.json只能设置 window 相关的配置项,以决定本页面的窗口表现,所以无需写 window 这个键,如:

{
  "window":{
    "navigationBarBackgroundColor": "#ffffff",
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "微信接口功能演示",
    "backgroundColor": "#eeeeee",
    "backgroundTextStyle": "light"
  }
}

相关

视频

RELATED VIDEOS

更多

免费

极客学院jQueryMobile视频教程

免费

极客学院Swift语言视频教程

免费

尚学堂Swift入门视频教程

免费

微信小程序--企业微网站

免费

Flutter基础视频教程
中级 Flutter基础视频教程

28784次学习

收藏

精选课程

更多
前端入门_HTML5
前端入门_HTML5

共29课时

61.8万人学习

CSS视频教程-玉女心经版
CSS视频教程-玉女心经版

共25课时

39.4万人学习

JavaScript极速入门_玉女心经系列
JavaScript极速入门_玉女心经系列

共43课时

71.1万人学习

独孤九贱(1)_HTML5视频教程
独孤九贱(1)_HTML5视频教程

共25课时

61.7万人学习

独孤九贱(2)_CSS视频教程
独孤九贱(2)_CSS视频教程

共22课时

23万人学习

独孤九贱(3)_JavaScript视频教程
独孤九贱(3)_JavaScript视频教程

共28课时

34万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时

125.3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号