小程序自定义 分享图片

 

    自定义分享内容

制图用的 原生的canvas 

js 部分

Page({

  /**

   * 页面的初始数据

   */

  data: {

    canvasList: null,

    CodeUrlbg: '../../status/image/1@2x.png', //背景图片

    destMinWidth: 500, //背景宽度

    maxHeight: 400, //背景高度

    destMul: 2, //画布写出倍数

    tempFilePath: ''

  },

  init(res) {

    console.log('init----', res)

    const canvas = res[0].node

    const ctx = canvas.getContext('2d')

    const dpr = wx.getSystemInfoSync().pixelRatio; //获取屏幕的像素比  值为2

    //新接口需显示设置画布宽高； w*2 h*2

    canvas.width = res[0].width * dpr;

    canvas.height = res[0].height * dpr;

    ctx.scale(dpr, dpr); //缩放

    this.setData({

      canvas,

      ctx

    });

    //向画布载入图片的方法

    this.canvasDraw(ctx, canvas).then(res => {

      console.log('1', res)

      // 向画布载入logo的方法

      return this.code(ctx)

    }).then(rrr => {

      console.log('2', rrr)

      //图片头像渲染完成之后，渲染文字

      wx.nextTick(

      this.title(ctx