收藏
回答

小程序如何绘制一个圆形图片?

问题模块 框架类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 canvas 工具 6.6.1 1.9.1

微信小程序如何使用canvas实现绘制一个圆形的png图片?

canvasContext.drawImage只能改变图片大小,位置,并不能改变图片展现形状,请问如何解决?


最后一次编辑于  2018-01-30  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

2 个回答

  • nullno
    nullno
    2018-02-05

    var ctx = wx.createCanvasContext('myCanvas');

    ctx.beginPath();

    ctx.arc(30, 30, 26.5, 0, 2 * Math.PI);

    ctx.setLineWidth(6)

    ctx.setStrokeStyle('描边颜色')

    ctx.stroke();//画空心圆

    ctx.closePath();

    ctx.save();

    ctx.arc(30, 30, 25, 0, 2 * Math.PI)

    ctx.clip(); //裁剪上面的圆形

    ctx.drawImage('图片', 0, 0, 60, 60);

    ctx.draw();


    2018-02-05
    赞同 2
    回复 1
    • Rohlin  罗林
      Rohlin 罗林
      10-14
      感谢大佬  你太优秀了
      10-14
      回复
  • 勤
    2018-03-16

    好的!已经解决了。谢谢!

    2018-03-16
    赞同
    回复