小程序
小游戏
企业微信
微信支付
扫描小程序码分享
- 需求的场景描述（希望解决的问题）
显示一些精致的游戏画面
- 希望提供的能力
像原生的HTML5一样提供
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" >
<meta name="viewport" content="width=750, target-densitydpi=device-dpi">
这些自定义屏幕显示配置
7 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
解决了，不要用离屏画布，直接设置上屏画布的canvas.width为实际像素宽度，比如
var cw = wx.getSystemInfoSync().screenWidth;
var ch = wx.getSystemInfoSync().screenHeight;
canvas.width = 750;
canvas.height = Math.ceil(ch / cw * canvas.width);
然后根据这个像素绘制图片就可以了，小游戏会自动把上屏画布的显示尺寸改成屏幕尺寸的，原理跟原生的canvas标签的原来是一样的，比如
<canvas width="750" height="1334" style="width:375px;height:667px;"></canvas>
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
我试了，画面区域就缩小了一半， 用微信浏览也是一样，所以 canvas.width = 750; 这个值是怎么得出的？
微信官方出的游戏，画面就挺好，不知道他们用了什么方法，难道要用WebGL ？？
没有，用了白开水建议的方法，画面有所改善，但是画面还是有点模糊
好的，谢谢回答，顺便问一下，为什么小程序不直接支持开发游戏，感觉现在的小游戏限制太多，比如没有view，实现一些页面效果时非常麻烦
可以将游戏内容先根据 devicePixelRatio 的倍数绘制到离屏画布上，再将该离屏画布上屏
具体信息可以在网络上搜索资料【Canvas 高清 绘制】
你好，你的反馈我们已收到，我们会在后续的版本中考虑增加类似功能。
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
解决了，不要用离屏画布，直接设置上屏画布的canvas.width为实际像素宽度，比如
var cw = wx.getSystemInfoSync().screenWidth;
var ch = wx.getSystemInfoSync().screenHeight;
canvas.width = 750;
canvas.height = Math.ceil(ch / cw * canvas.width);
然后根据这个像素绘制图片就可以了，小游戏会自动把上屏画布的显示尺寸改成屏幕尺寸的，原理跟原生的canvas标签的原来是一样的，比如
<canvas width="750" height="1334" style="width:375px;height:667px;"></canvas>
我试了，画面区域就缩小了一半， 用微信浏览也是一样，所以 canvas.width = 750; 这个值是怎么得出的？
微信官方出的游戏，画面就挺好，不知道他们用了什么方法，难道要用WebGL ？？
没有，用了白开水建议的方法，画面有所改善，但是画面还是有点模糊
小游戏离屏画布上图片或文字模糊的问题，楼主搞定了吗，是否可以分享下代码
好的，谢谢回答，顺便问一下，为什么小程序不直接支持开发游戏，感觉现在的小游戏限制太多，比如没有view，实现一些页面效果时非常麻烦
可以将游戏内容先根据 devicePixelRatio 的倍数绘制到离屏画布上，再将该离屏画布上屏
具体信息可以在网络上搜索资料【Canvas 高清 绘制】
你好，你的反馈我们已收到，我们会在后续的版本中考虑增加类似功能。