收藏
回答

在画布上画好内容,然后生成图片,生成的图片上字不清晰?

下面是稍微放大生成的图片的效果

wx.createSelectorQuery()
      .select("#myCanvas") // 在 WXML 中填入的 id
      .fields({ node: true, size: true })
      .exec((res) => {
        const canvas = res[0].node;
        // Canvas 画布的实际绘制宽高
        const renderWidth = res[0].width;
        const renderHeight = res[0].height;
        // Canvas 绘制上下文
        const ctx = canvas.getContext("2d");
        canvas.width = 375;
        canvas.height = 392;
        // 矩形
        // ctx.fillStyle = "#ff3435";
        ctx.fillStyle = "#ffffff";
        ctx.fillRect(0, 0, 375, 392);
        // 文本1
        ctx.font = "normal bold 18px PingFang";
        ctx.textAlgin = "left";
        ctx.fillStyle = "#000000";
        ctx.fillText("扫码体验小程序", 60, 120, 280);
        // 文本2
        ctx.font = "normal normal 12px sans-serif";
        ctx.textAlgin = "center";
        ctx.fillStyle = "#838383";
        ctx.fillText("微信扫一扫或微信中长按识别参与活动", 85.5, 150, 204);
        wx.canvasToTempFilePath({
          canvas: canvas,
          success(res) {
            // console.log(res);
            wx.saveImageToPhotosAlbum({
              filePath: res.tempFilePath,
              success(res) {
                // console.log(res);
                wx.showToast({
                  title: "图片已保存到相册",
                  icon: "success",
                  duration: 1000,
                });
              },
              fail(res) {
                console.log(res, 111);
              },
            });
          },
          fail(res) {
            console.log(res);
          },
        });
      });
回答关注问题邀请回答
收藏
登录 后发表内容