canvas教程

小技巧:wx.canvasToTempFilePath与获取屏幕宽高

字号+ 作者:H5之家 来源:H5之家 2017-04-03 18:00 我要评论( )

wx.canvasToTempFilePath wx.saveFile官方文档中只有一行,真是坑爹啊,原来wx.canvasToTempFilePath参数为一个对象包括canvasID,success,fail,complete,和wx.s

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.saveFile,保存的图片,我在iphone6上测试,提示保存成功,但在手机相册中无法查看,应该是这个保存功能不够完善,以后可能会出一个保存到相册吧。

  

**获取设备宽高

wx.getSystemInfo(OBJECT)

获取系统信息。

OBJECT参数说明:

参数类型必填说明

successFunction是接口调用成功的回调

failFunction否接口调用失败的回调函数

completeFunction否接口调用结束的回调函数(调用成功、失败都会执行)

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/屏幕宽度)

    iPhone51rpx = 0.42px1px = 2.34rpx

    iPhone61rpx = 0.5px1px = 2rpx

    iPhone6 Plus1rpx = 0.552px1px = 1.81rpx

  • rem(root em): 规定屏幕宽度为20rem;1rem = (750/20)rpx 。
  • 建议: 开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。 注意: 在较小的屏幕上不可避免的会有一些毛刺,请在开发时尽量避免这种情况。

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    网友点评
    t