android微信头像无显示,canvas用arc画圆安卓显示问题,获取微信头像不显示问题...
代码如下:
onLoad(options) {
const height = app.globalData.window_height;
const width = app.globalData.window_width;
const options = {
head_photo = 'https://wx.qlogo.cn/mmopen/vi_32/N78NX78hLfDwG56Ocyyjhibqro6sFjIZmUzJM5aI90ySicyqMeRToKLImXl7v8DRVwMmVggfMzy1m15d2P5beejg/0',
qrcode='http://oixavq5ec.bkt.clouddn.com/yaliapi/1302/wechat/b07f9201804161810206895.png'
}
if (options) {
const optionsArr = Object.keys(options).filter(x => x != 'nickname');
optionsArr.map((x, k) => {
if (x == 'head_photo' || x == 'qrcode') {
this.downloadCanvasImg(x, options[x], (optionsArr.length - 1 == k ? true : false))
}
})
}
},
downloadCanvasImg(name, url, end) {
const options = immutable.fromJS(this.data.options).toJS();
wx.downloadFile({
url,
success: res => {
const urls = res.tempFilePath;
options[name] = urls;
this.setData({ options })
console.log(name, url, end, urls);
if (end) {
this.drawCanvas(this.data.options);
}
},
fail: fres => {
this.downloadCanvasImg(options, end)
}
})
},
drawCanvas(options) {
const { width, height, backgroundColor } = this.data;
const imgUrl = options.head_photo;
const qrcodeUrl = options.qrcode
const ctx = wx.createCanvasContext('myCanvas');
const grd = ctx.createLinearGradient(0, 0, 0, 160)
// grd.addColorStop(0, this.colorRgb(backgroundColor))
// grd.addColorStop(.2, this.colorRgb(backgroundColor))
// grd.addColorStop(1, this.colorRgb(backgroundColor, true))
grd.addColorStop(0, '#16ca4e')
grd.addColorStop(.2, '#16ca4e')
grd.addColorStop(1, '#16ca4e')
ctx.beginPath()
ctx.arc(width / 2, -180, width / 2 + 200, 2 * Math.PI) // height: width / 2 + 20
ctx.fillStyle = grd
ctx.fill()
ctx.closePath()
ctx.beginPath()
ctx.setFillStyle('#ffffff')
ctx.setTextAlign('center')
ctx.setFontSize(55)
ctx.fillText('佣金升级', width / 2, 80)
ctx.fillText('福利双赢', width / 2, 130)
ctx.setTextAlign('center')
ctx.closePath()
ctx.save()
ctx.beginPath();
ctx.setFillStyle('white');
ctx.setShadow(0, 2, 5, 'rgba(0, 0, 0, .2)')
ctx.arc(width / 2, width / 2 + 20, 40, 0, 2 * Math.PI);
ctx.fill();
ctx.clip();
ctx.drawImage(imgUrl, width / 2 - 40, width / 2 - 20, 80, 80)
ctx.restore()
ctx.closePath()
ctx.beginPath()
ctx.arc(width / 2, 280, 50, 2 * Math.PI)
ctx.setFillStyle('red')
ctx.fill()
ctx.closePath()
ctx.beginPath()
ctx.setFillStyle('#333')
ctx.setTextAlign('center')
ctx.setFontSize(16)
ctx.fillText('MaobabyDad', width / 2, width / 2 + 80)
ctx.setTextAlign('center')
ctx.closePath()
ctx.beginPath()
const grd2 = ctx.createCircularGradient(width / 2, width / 2 + 195, 127)
grd2.addColorStop(0, '#16ca4e')
grd2.addColorStop(.9, '#16ca4e')
grd2.addColorStop(1, '#16ca4e')
ctx.rect(width / 2 - 90, width / 2 + 105, 180, 180)
ctx.setFillStyle(grd2)
ctx.closePath()
ctx.beginPath()
const qrcode = ctx.drawImage(qrcodeUrl, width / 2 - 80, width / 2 + 115, 160, 160)
ctx.closePath()
ctx.beginPath()
ctx.setFillStyle('#333')
ctx.setTextAlign('center')
ctx.setFontSize(16)
ctx.fillText('将海报发送给好友,赚取佣金', width / 2, width / 2 + 330)
ctx.setTextAlign('center')
ctx.closePath()
ctx.draw()
},
开发工具的效果是:
安卓(小米)机上的效果:
苹果(6sp)真机效果:
android微信头像无显示,canvas用arc画圆安卓显示问题,获取微信头像不显示问题...相关推荐
- 微信小程序圆盘抽奖(扇形画圆)
微信小程序圆盘抽奖(扇形画圆) 前言 提示:这里可以添加本文要记录的大概内容: 例如:领导安排做一个微信小程序的转盘抽奖,要求可以复用,动态的修改抽奖的板块个数,由于是第一次做微信小程序踩了很多的坑, ...
- 微信小程序实现地图自定义大小画圆以及地图自适应(iview-Weapp+微信开发者工具)
iview-Weapp 本项目中使用的UI为iview-Weapp,可在百度自行进入官网并根据文档下载并引入至项目,此处就不多说了. 具体实现 主要实现了在微信小程序下使用地图的marker点击弹出画 ...
- 微信小程序使用canvas绘图,并保存下载到本地。圆形头像,虚线网络图片
wxml <button class="btn" type="primary" form-type="submit" bindtap ...
- 通过安卓手机,获取微信小程序包进行反编译方法
要求 安装Nodejs 一台root后的安卓手机或者装有可以打开微信小程序的安卓模拟器 一个敢于折腾的耐心 准备 安装反编译工具 [推荐]方法一:你可以通过git clone将它存在本地 git cl ...
- canvas --用循环画圆
本篇博客主要介绍圆方面的简单应用以及用循环画下面的栗子 在canvas中绘制圆形, 我们将使用以下方法:arc(x: number, y: number, radius: number, startA ...
- android自定义圆形进度条,实现动态画圆效果
自定义圆形进度条效果图如下:应用场景如动态显示分数等. view的自定义属性如下attr.xml <?xml version="1.0" encoding="UTF ...
- PC网站接入微信登陆流程四:后端处理登陆后的code,和获取微信登陆用户的信息
1.文档在这里 ==>> 授权后接口调用(UnionID) 2.前端登陆成功后,需要提交code给后端,后端接受到请求后,进行处理,下面的例子均为Python版本 第一步:通过code获取 ...
- 微信小程序授权登录获取用户头像和昵称时得到微信用户,记录getUserInfo转变为getUserProfile的使用修改
首先,在微信官方更新授权操作之前,我们一直使用getUserInfo来获取微信用户的头像和昵称以及openid,这个可以参考我的上一篇博客(使用getUserInfo获取用户头像),但是微信官方弃用g ...
- 微信小程序获取用户头像昵称
微信小程序获取头像昵称问题解决 文章目录 微信小程序获取头像昵称问题解决 前言和传统方法 问题描述 解决方案 实现效果 前言和传统方法 微信小程序是一种基于微信开发平台的轻应用,用户可以通过微信扫码. ...
最新文章
- 如何使用Nsight Compute?
- 计算机缺少log怎么解决方法,win10 计算机丢失logmanager怎么办_win10丢失log.dll文件的解决方法-win7之家...
- Windows上安装JDK
- get传输时,会将加号+ 转换为空格
- laytpl语法_浅谈laytpl 模板空值显示null的解决方法及简单的js表达式
- MySQL Study之--MySQL下图形工具的使用(phpMyAdmin)
- 还记得爆火的图解算法吗?现在图解机器学习算法书来了!送书10本!
- 简单的数据库造数据方法
- 压缩包文件打开密码如何破解
- 学计算机辅助制造的感受,计算机辅助制造CAM介绍
- 大学概率论与数理统计知识点详细整理
- 一条命令搞定黑苹果双系统时差
- linux环境下配置apache ,mysql,php,超简单
- 国内外关于文物安全的法律法规、政策、标准等公开文件收集
- (转)段永平:投资不怕集中,不是一般的集中而是绝对的集中
- 产品经理工作流| 月度汇报月报整理
- 使用深度学习的图像分割(综述)
- idea的database离线配置DB2驱动
- Linux Linux中“”, “.“和”..“的含义
- Docker Universal Control Plane(UCP)——提供企业级的容器云的解决方案