个人案例
画线九宫格
此小程序可将手机相册里的图片进行等分画线,可仅画线不分割。便于绘画起草布局,亦可用于相关工程人员的简单测量。
画线九宫格——新手素描起形工具扫码体验
看vConsole是否有报错
小程序首页页面,ios会出现空白,重新进入就正常,请问是什么原因?小程序首页页面,ios会出现空白,重新进入就正常,请问是什么原因?
2021-06-21图片onload是异步的,所以你canvasToTempFilePath时图片还没画完呢。要么你把绘制图片改成Promise,要么你加个延时。
微信小程序canvasToTempFilePath 保存时候无法保存图片文字可以保存?// pages/dispatch/waybillModel/components/shareDrawing/index.js Component({ /** * 组件的属性列表 */ properties: { }, /** * 组件的初始数据 */ data: { photoFile: '' //本地图片路径 }, /** * 组件的方法列表 */ methods: { /** * 获取本地图片 */ getPhotoFile: function(e) { e.success(this.data.photoFile); }, getShareDrawing: function(e) { let _this = this; let goodsName = e.goodsName; //货物名称 let beginCity = e.beginCity; //出发省份 let beginAddress = e.beginAddress; //出发详细地址 let endCity = e.endCity; //目的地城市 let endAddress = e.endAddress; //目的地详情地址 let QRCode = e.QRCode; //二维码图片 //返回一个 SelectorQuery 对象实例 const query = this.createSelectorQuery(); //选择canvas query.select('#myCanvas') .fields({ node: true, size: true }) .exec((res) => { const canvas = res[0].node; //获取 canvas 对象 const ctx = canvas.getContext('2d'); // 获取Context 对象 //canvas 缩放 const dpr = wx.getSystemInfoSync().pixelRatio; canvas.width = res[0].width * dpr; canvas.height = res[0].height * dpr; ctx.scale(dpr, dpr); //绘制顶部边条 _this.setHeadStrip(canvas, ctx); //绘制货物名称 _this.setTitle(ctx, goodsName); //绘制提示 _this.setTips(ctx); //绘制二维码 _this.setQRCode(canvas, ctx, QRCode) //绘制出发地图标 _this.setBeginIcon(canvas, ctx); //绘制出发省份 _this.setBeginCity(ctx, beginCity); //绘制出发详细地址 _this.setBeginAddress(ctx, beginAddress); //绘制目的地图标 _this.setEndIcon(canvas, ctx); //绘制目的地城市 _this.setEndCity(ctx, endCity); //绘制目的地详情地址 _this.setEndAddress(ctx, endAddress); //生成图片 wx.canvasToTempFilePath({ canvas, success(res) { _this.setData({ photoFile: res.tempFilePath }) } }) //end exec }) //end }, /** * 设置货物名称 * @param {Object} ctx Context 对象 * @param {Object} str 名称文本 */ setTitle: function(ctx, str) { const width = 342 // 获取设备宽度 ctx.font = '500 19px PingFangSC-Medium'; ctx.fillStyle = '#000'; ctx.fillText(str, (width - ctx.measureText(str).width) * 0.5, 40); }, /** * 设置顶部条形 * @param {Object} canvas canvas 对象 * @param {Object} ctx Context 对象 * @param {Object} src 图片链接 */ setHeadStrip: function(canvas, ctx) { const headerImg = canvas.createImage(); // 获取image 对象 headerImg.src = 'https://cdn.nucarf.cn/xgb/v1.0/public/head.png'; headerImg.onload = () => { ctx.drawImage(headerImg, 0, 0, 342, 10); }; }, /** * 绘制二维码 * @param {Object} canvas canvas 对象 * @param {Object} ctx Context 对象 * @param {Object} src 图片链接 */ setQRCode: function(canvas, ctx, src) { const headerImg = canvas.createImage(); // 获取image 对象 headerImg.src = src; headerImg.onload = () => { ctx.drawImage(headerImg, 101, 103, 140, 140); ctx.restore(); }; }, /** * 绘制提示 * @param {Object} ctx Context 对象 */ setTips: function(ctx) { const width = 342 // 获取设备宽度 ctx.font = '500 15px PingFangSC-Medium'; ctx.fillStyle = '#F1950A'; let str = "请司机扫码上传证件"; ctx.fillText(str, (width - ctx.measureText(str).width) * 0.5, 70); }, /** * 绘制出发地图标 * @param {Object} canvas canvas 对象 * @param {Object} ctx Context 对象 */ setBeginIcon: function(canvas, ctx) { const headerImg = canvas.createImage(); // 获取image 对象 headerImg.src = 'https://cdn.nucarf.cn/xgb/v1.0/public/begin1.png'; headerImg.onload = () => { ctx.drawImage(headerImg, 30, 300, 21, 34); }; }, /** * 绘制出发城市 */ setBeginCity: function(ctx, str) { ctx.font = '500 16px PingFangSC-Medium'; ctx.fillStyle = '#000'; ctx.fillText(str, 61, 310); }, /** * 绘制详细地址 */ setBeginAddress: function(ctx, str) { ctx.font = '400 14px PingFangSC-Medium'; ctx.fillStyle = '#666666'; ctx.fillText(str, 61, 330); }, /** * 绘制目的地图标 * @param {Object} canvas canvas 对象 * @param {Object} ctx Context 对象 */ setEndIcon: function(canvas, ctx) { const headerImg = canvas.createImage(); // 获取image 对象 headerImg.src = 'https://cdn.nucarf.cn/xgb/v1.0/public/end1.png'; headerImg.onload = () => { ctx.drawImage(headerImg, 30, 368, 21, 34); }; }, /** * 绘制目的地城市 */ setEndCity: function(ctx, str) { ctx.font = '500 16px PingFangSC-Medium'; ctx.fillStyle = '#000'; ctx.fillText(str, 61, 380); }, /** * 绘制目的地详细地址 */ setEndAddress: function(ctx, str) { ctx.font = '400 14px PingFangSC-Medium'; ctx.fillStyle = '#666666'; ctx.fillText(str, 61, 400); } } })
2021-06-21那你就无脑用wx.redirectTo跳转呗
微信小程序如何禁止返回上一页?就是不管什么情况下,都禁止用户通过左上角的返回,手机自带的回退或者左右滑动的回退,统统禁用掉。有好的方案吗?大侠们·····
2021-06-21ctx.font = "bold 32px Arial";
报告一个bughttps://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.setFontSize.html. 使用最新的 font() 方法。和 setFontSize() 方法 都不好用 告诉我 不是一个函数
2021-06-11刘海屏顶部高度嘛
在苹果12手机wx.getSystemInfoSync()获取safeArea.top为什么是20?在苹果12手机wx.getSystemInfoSync()获取safeArea.top为什么是20?
2021-05-11可以的呀
能否复制已认证的公众号资质创建微信小游戏?请问能否复制已认证的公众号资质创建微信小游戏,这样就不用重复认证了?
2021-05-11可能是access_token错了
重大bug急急急统一消息服务: https://api.weixin.qq.com/cgi-bin/message/wxopen/template/uniform_send?access_token= 返回 {errcode: 40003, errmsg: "invalid openid rid: 608a2404-10796acb-3e437f3a"} 这个openid错误是什么错误?openid没有填写错,这个经过验证openid可以使用微信支付不应该错
2021-04-29是挺低俗的,腾讯审核也不管管
官方能否允许流量主屏蔽小说类广告?目前来看小说类广告存在隐晦色情、低俗元素。还是希望官方能够允许用户屏蔽小说类广告。
2021-04-13没门
小程序支付如果是嵌入的外部h5页面可以采用添加银行卡支付的方式吗?小程序支付如果是嵌入的外部h5页面可以采用添加银行卡支付的方式吗?
2021-04-09https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html 你不存就不需要用户授权
不授权仅获取用户头像和昵称能过审么?我只为了展示头像和昵称不知道需要用户授权不,希望能够得到回复
2021-03-19