这篇文章主要讲解了“小程序canvas尺寸如何设置”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“小程序canvas尺寸如何设置”吧！
微信小程序尺寸设置可使用rpx来标记尺寸，类同rem可在微信小程序中自适应兼容换算不同的机型尺寸。
但在小程序canvas中，尺寸换算会无效(由于绘画的滞后)，因此需要自适应计算canvas尺寸。
一.解决方案
使用小程序提供的getSystemInfo可以获取当前设备的系统信息，通过获取当前的设备尺寸，来换算所需要设置的canvas尺寸，从而使得canvas绘图可以适用于所有设备。
wx.getSystemInfo(OBJECT)
获取系统信息。
示例代码：
wx.getSystemInfo({
success: function(res) {
console.log(res.model)
console.log(res.pixelRatio)
console.log(res.windowWidth)
console.log(res.windowHeight)
console.log(res.language)
console.log(res.version)
console.log(res.platform)
}
})
二.计算示例
获取当前窗口宽、高以动态换算需要的canvas尺寸
wx.getSystemInfo({
//获取系统信息成功，将系统窗口的宽高赋给页面的宽高
success: function (res) {
that.width = res.windowWidth
that.height = res.windowHeight
that.radius = 105 / 602 * that.height
}
})
感谢各位的阅读，以上就是“小程序canvas尺寸如何设置”的内容了，经过本文的学习后，相信大家对小程序canvas尺寸如何设置这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是亿速云，小编将为大家推送更多相关知识点的文章，欢迎关注！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
