微信 小程序 drawImage wx.canvasToTempFilePath wx.saveFile 获取设备宽高 尺寸问题
以下问题测试环境为微信开发者0.10.102800,手机端iphone6,如有不对敬谢指出。
根据我的测试,context.drawImage,在开发者工具中并不能画出来,只有预览到手机中显示。
wx.canvasToTempFilePath wx.saveFile
官方文档中只有一行,真是坑爹啊,原来
wx.canvasToTempFilePath参数为一个对象包括canvasID,success,fail,complete,和wx.saveFile差不多;
wx.canvasToTempFilePath({
canvasId: 'target',
success: function success(res) {
wx.saveFile({
tempFilePath: res.tempFilePath,
success: function success(res) {
console.log('saved::' + res.savedFilePath);
},
complete: function fail(e) {
console.log(e.errMsg);
}
});
},
complete: function complete(e) {
console.log(e.errMsg);
}
});
官方文档中只有一行,真是坑爹啊,原来
wx.canvasToTempFilePath参数为一个对象包括canvasID,success,fail,complete,和wx.saveFile差不多;

wx.saveFile,保存的图片,我在iphone6上测试,提示保存成功,但在手机相册中无法查看,应该是这个保存功能不够完善,以后可能会出一个保存到相册吧。
**获取设备宽高
wx.getSystemInfo(OBJECT)
获取系统信息。
OBJECT参数说明:
| 参数 | 类型 | 必填 | 说明 |
|---|---|---|---|
| success | Function | 是 | 接口调用成功的回调 |
| fail | Function | 否 | 接口调用失败的回调函数 |
| complete | Function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
success回调参数说明:
| 属性 | 说明 |
|---|---|
| model | 手机型号 |
| pixelRatio | 设备像素比 |
| windowWidth | 窗口宽度 |
| windowHeight | 窗口高度 |
| language | 微信设置的语言 |
| version | 微信版本号 |
**尺寸问题
在小程序中,支持还可以使用vw(1%的屏幕宽),vh(1%的屏幕高),
在wxss中虽然使用表达式calc不会报错,但这个值是无效的。
尺寸单位
- rpx(responsive pixel): 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。
| 设备 | rpx换算px (屏幕宽度/750) | px换算rpx (750/屏幕宽度) |
|---|---|---|
| iPhone5 | 1rpx = 0.42px | 1px = 2.34rpx |
| iPhone6 | 1rpx = 0.5px | 1px = 2rpx |
| iPhone6 Plus | 1rpx = 0.552px | 1px = 1.81rpx |
- rem(root em): 规定屏幕宽度为20rem;1rem = (750/20)rpx 。
建议: 开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。 注意: 在较小的屏幕上不可避免的会有一些毛刺,请在开发时尽量避免这种情况。
以上问题测试环境为微信开发者0.10.102800,手机端iphone6,如有不对敬谢指出。
微信 小程序 drawImage wx.canvasToTempFilePath wx.saveFile 获取设备宽高 尺寸问题的更多相关文章
- 微信小程序数据请求方法wx.request小测试
微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...
- 微信小程序wepy开发循环wx:for需要注意
微信小程序wepy开发循环wx:for需要注意 item index值必须在wx:for之后使用 <view wx:for="{{tablist}}" class=" ...
- 微信小程序开发(request请求后台获取不到data)
1微信的request的post请求后台获取不到data(当初这个问题纠结了好久好久),原因是post传递的data是json格式而不是key,value的格式,所以获取不到相应的data就是post ...
- 微信小程序-用户拒绝授权使用 wx.openSetting({}) 重新调起授权用户信息
场景模拟:用户进入微信小程序-程序调出授权 选择拒绝之后,需要用到用户授权才能正常使用的页面,就无法正常使用了. 解决方法:在用户选择拒绝之后,弹窗提示用户 拒绝授权之后无法使用,让用户重新授权(微信 ...
- 微信小程序如何在使用wx.request使用cookie
我主要是做asp.net mvc后端开发的,经常使用Jquery的ajax与后台的Web API进行数据交互. 最近公司要做一个小程序,要实现小程序与Web前端的通信,当然小程序是可以实现socket ...
- 微信小程序的坑之wx.miniProgram.postMessage
工作中有个需求是小程序的网页在关闭的时候,需要回传给小程序一个参数 查阅小程序官方文档,有这样一个接口 wx.miniProgram.postMessage ,可以用来从网页向小程序发送消息,然后通过 ...
- 微信小程序组件——详解wx:if elif else的用法
背景 在学习微信小程序开发wxml页面时,需要使用if,else来判断组件是否进行展示,代码如下 <view wx:if="{{is_login==1}}">成功登录& ...
- 微信小程序踩坑之一[wx.request]请求模式
最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.req ...
- 微信小程序 drawImage 问题
好久没写了,其实可写的还是挺多,主要还是懒吧... 最近公司项目使用小程序做序列帧动画,大概有 116 张图,共9.6M. 比较闲的日子里实验了一番,主要有以下几种方法, 1. css backgro ...
随机推荐
- Visual Studio 2010安装教程
VS2010是一个集C++,VB,C#,等编程环境于一身的集成开发环境,功能强大,能有效提高编程效率.针对 Visual Studio 2010 完全重新设计了帮助查看器.您可以使用首选的 Web 浏 ...
- PhotoShop常用快捷键
Photoshop常用快捷键: 图01 图02 图03 图04 图05 快捷键 PS快捷键是Photoshop为了提高绘图速度定义的快捷方式,它用一个或几个简单的字母来代替常用的命令. 多种工具共用一 ...
- 微软公有云Windows Azure 2014-03-26 国内正式商用
新浪科技讯 3月27日早间消息,微软国昨天下午宣布由世纪互联负责运营的Microsoft Azure公有云服务正式商用.这是国内首个正式商用的国际公有云服务平台.而开正式开放商用,意味着任何企业现在都 ...
- JAVA 设计模式 适配器模式
用途 适配器模式 (Adapter) 将一个类的接口转换成客户希望的另外一个接口. Adapter模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作. 适配器模式是一种结构型模式. 结构
- Git undo 操作
相比传统的版本管理工具,git 的 undo 操作也不是很简单明了,本文尝试总结常用的 undo 操作. 重新提交 应该避免考虑不周全的提交,但这太难了.因此Git 专门提供了一个命令来弥补粗心的提交 ...
- JavaScript基础插曲-练习
Javascript基础学习 eg:利用正则表达式来去掉空格. 1:msg=' Hello ': <script type="text/javascript"> ...
- LINQ的ElementAt与ElementAtOrDefault方法
2个方法,均返回集合中指定索引的元素.区别在于前者当没有结果返回时,抛出异常,而后者如果没有结果则返回默认值. 参考例子: 上图示例中,红色数字是集合的索引,它是从0开始.只要知道它是从0开始,那下面 ...
- C# winform Listbox添加和删除items
两个listbox添加和删除items #region 添加/移除 //添加 private void btnAdd_Click(object sender, EventArgs e) { ) { r ...
- C#编程总结(三)线程同步
C#编程总结(三)线程同步 在应用程序中使用多个线程的一个好处是每个线程都可以异步执行.对于 Windows 应用程序,耗时的任务可以在后台执行,而使应用程序窗口和控件保持响应.对于服务器应用程序,多 ...
- 扩展WPF的DataGrid按方向键移动焦点
WPF的DataGrid默认的移动行为如下: (1)当前单元格不处于编辑状态时可使用方向键移动焦点. (2)当前单元格处于编辑状态时不可使用方向键移动焦点;按Enter键,当前单元格退出编辑状态,焦点 ...