预览模式下, 绘制时大几率文字重复, 导致重叠现象

[Maple13]

• 重现场景:
  微信开发者工具, <预览>模式

• 操作:
  手机扫码, 点击绘制

• 问题:
  大几率下文字重复/重叠

• 图:

[kuckboy1994]

你好，请问你这个是什么手机，屏幕分辨率和dpr能说一下嘛？

你看到的这个其实是文字加粗的效果，因为canvas中默认是没有文字加粗的，实现的话通过偏移较小的像素来达到加粗的效果。

[zhaqiezi]

小程序的canvas要生成图片的话,必须放在回调里面.在一些安卓手机上,放在回调里面的话,文字可能出现错乱的效果.想知道这个是如何解决的.

[kuckboy1994]

@zhaqiezi 你的手机型号是多少？

你测试过了，是因为放在回调了导致的？。。

[zhaqiezi]

@kuckboy1994 我是之前自己写过这种生成图片的,然后出现了文字会错乱的问题.
在安卓手机上会出现文字错乱的效果的效果,没有测试过很多机型,只是拿了荣耀和三星的来测试过,发现这样的问题是随机的.
在社区里面看到过别人也有这样的问题.是否是回调导致的并没有自己测试,而是看出现过该问题的人回答的.

[Maple13]

@kuckboy1994
我的手机型号是努比亚 Z11, 屏幕分辨率 1920x1080像素, dpr 为 3;
我同事的手机也有这个问题, 手机型号是华为荣耀6X, 屏幕分辨率 1920x1080像素

[kuckboy1994]

@Maple13 @zhaqiezi
这个问题我已经复现了，可以出现在大部分的安卓设备上（刚才测试的 努比亚z9max、mi note2、小米max2、魅族），性能越差越容易出现，例如：z9max。

测试同样的绘画效果（不使用当前组件）也会出现问题。猜测应该是微信api的问题。

测试之后个人结论：setFillStyle、setFontSize 这些方法在安卓设备上可能无法立刻设置成功，设置成功的时候已经开始在绘制其他的文字了。导致字体大小和颜色不对（混乱）。

接下去会重点考虑这个问题的解决办法。

如果你们有什么好的想法可以和我说。

谢谢

[feelslive]

尝试用了一下挺简单好用的，遗憾的是绘制图片没有圆角属性（已看过你的回答），我测试用的是荣耀8 也时而出现文字混乱重复的情况，猜测可能就是微信api的bug，非常感谢提供简单易用的轮子。

[kuckboy1994]

@feelslive
感谢支持。
接下去我会重点修复这个问题。

[894752114]

这个问题修复了吗？我也出现这个问题

[GreedyBlade]

同问问题修复了吗？这个问题在真机预览的时候会随机出现