原文:在微信小程序使用canvas生成海报,并保存图片在本地

目标:在微信小程序中页面有一个按钮,点击后生成一张海报,点击保存,图片保存到本地相册 海报样式如下: 通过观摩别人代码,分析这张海报,难点有四个,一是背景的圆角,canvas并没有一个api是画圆角的,二是中间的两行标题,这里应该是动态的,可能一行可能两行,三是圆形头像处理,四是,画出的海报如何在点击下载的时候很好的布局。最终成果如下: wxml: wxss: js中的data: js中的onLo ...

2021-11-17 15:09 0 3642 推荐指数:

查看详情

程序生成海报保存本地

项目中遇到需要分享到朋友圈,但是查询api发现程序并没有提供分享到朋友圈的功能,只能实现通过canvas画一张海报然后保存本地,让用户主动去发朋友圈。 效果图生成海报 首先使用程序提供的canvasapi将第二张图显示的海报画出来 然后调用保存本地的接口 ...

Mon Sep 23 20:08:00 CST 2019 0 1610
程序实现生成海报并且保存本地

项目中遇到需要分享到朋友圈,但是查询api发现程序并没有提供分享到朋友圈的功能,只能实现通过canvas画一张海报然后保存本地,让用户主动去发朋友圈。 先看效果图 首先使用程序提供的canvasapi将第二张图显示的海报画出来 然后调用保存本地的接口 ...

Thu Apr 19 23:04:00 CST 2018 6 42627
程序canvas生成保存图片

程序canvas生成保存图片,具体实现效果如下图 实现效果需要做以下几步工作 一、先获取用户屏幕大小,然后才能根据屏幕大小来定义canvas的大小 二、获取图片(二维码)的宽高,并对图片进行等比例缩放在canvas绘制 三、文字的布局 四、将canvas内容生成图片 ...

Wed Oct 23 18:02:00 CST 2019 1 3285
程序利用canvas生成海报分享图片

一 . 效果 这是借用女神照生成的分享的海报图片来自网络。 新增了poster组件和更新图片自适应 二 . 准备 准备两张图片连接,最好是自己开发账号验证的https图片链接。 三 . 实现思路 其实就是canvas实现方式,首先要 ...

Thu May 02 00:47:00 CST 2019 0 769
程序分享之生成海报--canvas

首先看文档 了解知识点~~(https://developers.weixin.qq.com/miniprogram/dev/component/) githup:https://github.com/ad-skylar/wxProjece_canvas 一.画布。 1.wxml 创建 ...

Wed Sep 04 02:42:00 CST 2019 2 3106
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM