收藏
回答

canvas绘制图像后在图像上添加文本bug

问题模块
API和组件

微信小程序开发中,绘制一个图像,然后再图像上添加文本内容,开发工具中运行效果不显示文本内容。

test.wxml内容如下:

<view class="classname">

<canvas canvas-id="brandCanvas" style="width:100%"/>

</view>

test.js具体代码如下:

  onReady: function () {

    var phoneInfo = wx.getSystemInfoSync();

    var brand = "hello";

    var ctx = wx.createCanvasContext("brandCanvas");

    var path = "../../imgs/dog.png";

    ctx.drawImage(path, 0, 0, phoneInfo.windowWidth, phoneInfo.windowHeight);

    ctx.draw();

  

    ctx.setFontSize(30);

    ctx.setFillStyle("#ff0000");

    ctx.fillText(brand, phoneInfo.windowWidth*0.3, phoneInfo.windowHeight*0.05);

    ctx.draw(true);

  },

注意代码ctx.draw(true)必须要加参数true

以上运行效果在开发工具中不能看到文本内容,但是在真机测试中是OK的!


最后一次编辑于  2017-08-30
回答关注问题邀请回答
收藏

1 个回答

  • Albert Einstein [官]
    Albert Einstein [官]
    2017-08-30

    可以试一下 Beta 版本的开发工具

    2017-08-30
    赞同
    回复