收藏
回答

小程序canvas切圆角矩形android存在兼容问题

框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
小程序 Bug Android 7.1.1 所有android 6.6.6




图1是ios的效果,图2是android的效果,图3是代码片段,求canvas大神指点

回答关注问题邀请回答
收藏

20 个回答

  • 视频号小店技术助手 - cunjin
    视频号小店技术助手 - cunjin
    2018-04-28

    你好,我这里有一份canvas画圆角的代码,在android上是ok的,请参考

    roundRect1: function (x, y, w, h, r) {

    // 开始绘制

    const ctx = this.ctx

    ctx.beginPath();

    this.ctx.setFillStyle('#ffffff');

    ctx.arc(x + r, y + r, r, Math.PI, Math.PI * 1.5);


    ctx.moveTo(x + r, y);

    ctx.lineTo(x + w - r, y);

    ctx.lineTo(x + w, y + r);


    ctx.arc(x + w - r, y + r, r, Math.PI * 1.5, Math.PI * 2);


    ctx.lineTo(x + w, y + h - r);

    ctx.lineTo(x + w - r, y + h);


    ctx.arc(x + w - r, y + h - r, r, 0, Math.PI * 0.5);


    ctx.lineTo(x + r, y + h);

    ctx.lineTo(x, y + h - r);


    ctx.arc(x + r, y + h - r, r, Math.PI * 0.5, Math.PI);


    ctx.lineTo(x, y + r);

    ctx.lineTo(x + r, y);

    this.ctx.fill();

    this.ctx.setGlobalAlpha(0.04);

    this.ctx.setShadow(0, 2, 4, '#000000')

    ctx.closePath();

    this.ctx.draw(true)

    return this;

    }


    2018-04-28
    有用
    回复 1
    • prince
      prince
      2019-12-10
      画圆角矩形图片的吗 遇到了兼容问题,工具调试是好的安卓机画的不是完整的
      2019-12-10
      回复
  • 小样贼拽
    小样贼拽
    2018-04-28

    没有解决

    2018-04-28
    有用
    回复
  • 花开富贵
    花开富贵
    2018-04-28

    @四楼,那最后你的问题是怎么解决的

    2018-04-28
    有用
    回复
  • 花开富贵
    花开富贵
    2018-04-28

    最好是可以留一个联系方式,因为我们的小程序设计的功能点很多,数据量也比较大,用户群体针对的比较广泛,发现了比较多的问题,感觉每次社区提问反馈这样效率不是特别高

    2018-04-28
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-04-28

    @四楼,不好意思,是我的疏忽,我们会尽快解决

    2018-04-28
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-04-28

    好的,我们尽快处理

    2018-04-28
    有用
    回复
  • 小样贼拽
    小样贼拽
    2018-04-28

    这个问题我之前就反应过,官方说给个代码片段,我给了,到现在都没回应


    2018-04-28
    有用
    回复
  • 花开富贵
    花开富贵
    2018-04-28

    小程序开发工具看的是没有问题的,但是真机测试的时候是会有这个现象,麻烦给提供一个解决方案

    2018-04-28
    有用
    回复
  • 花开富贵
    花开富贵
    2018-04-28

    代码片段:wechatide://minicode/IPlqjPmE6hZs

    机型:所有android都会出现

    微信版本:6.6.6

    2018-04-28
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-04-27

    你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    2018-04-27
    有用
    回复

正在加载...

登录 后发表内容