当前位置：首页 > 编程日记 > 正文

微信小程序（canvas）画图保存到本地相册（wepy）

编程日记 2024-09-08 15:00:00

html标签部分

因为这个需要用户授权所以需要使用button，画布使用的是canvas，这个可以参考小程序官方文档，代码如下

 <button class='btn'  type="default" open-type="getUserInfo"  @tap='exportImg'>生成图片保存到本地</button><canvas canvas-id="shareCanvas" style='width:375px;height:515px'/>
复制代码

js实现部分

（1）注意这里如果是采用网络图片作为地图的话，注意小程序download的授权问题，图片域名需要时认可的，

（2）使用网络图片之前需要先用户授权scope.writePhotosAlbum，授权成功之后再调用下载（downloadFile）的api

（3）顺序是，用户授权->调用下载api->调用选择网络图片api->创建canvas->绘制画布->绘制文本，样式->将内容绘制到画布上->生成图片->保存到系统相册，代码如下

 methods = {exportImg: () => {// 先获取用户授权wx.getSetting({success: (res) => {if (!res.authSetting['scope.writePhotosAlbum']) {wx.authorize({scope: 'scope.writePhotosAlbum',success: () => {this.methods.draw()}})} else {this.methods.draw()}} }) },draw: () => {wx.downloadFile({ // 先下载url: 'xxx.png', // 仅为示例，并非真实的资源success: (res) => {if (res.statusCode === 200 ||res.statusCode === 201) {console.log(res, '-------')wx.getImageInfo({  //  选择网络图片src: res.tempFilePath,success: (res) => {console.log('底图画好了')console.log(res.path, '底图路径')// createCanvasContext 创建 canvas 绘图上下文（指定 canvasId）const ctx = wx.createCanvasContext('shareCanvas')// drawImage 绘制图像到画布。ctx.drawImage(res.path, 0, 0, 375, 515)ctx.setTextAlign('center')    // 用于设置文字的对齐ctx.setFillStyle('#1AA9E3') // 文字颜色ctx.setFontSize(35)     // 文字字号ctx.fillText('简单', 375 / 2, 515 / 3)  //  在画布上绘制被填充的文本。ctx.setFillStyle('#C9D75E')ctx.setFontSize(22)ctx.fillText('我从你的全世界路过了一下', 375 / 2, 220)console.log('文字画好了')// ctx.stroke()   //  画出当前路径的边框。默认颜色色为黑色。ctx.draw()  // 将之前在绘图上下文中的描述（路径、变形、样式）画到 canvas 中。console.log('图生成了')///  把当前画布指定区域的内容导出生成指定大小的图片，并返回文件路径const wxCanvasToTempFilePath = wx.canvasToTempFilePath// 保存图片到系统相册  需要用户授权 scope.writePhotosAlbumconst wxSaveImageToPhotosAlbum = wx.saveImageToPhotosAlbumwxCanvasToTempFilePath({canvasId: 'shareCanvas',success: function(res) {wxSaveImageToPhotosAlbum({filePath: res.tempFilePath,success(res) {console.log('保存好了')wx.showToast({title: '已保存到相册'})   }   })  }}) } }) }  }})}};
复制代码

效果图（马赛克一下原图，嘿嘿）

注意

（1）如果使用网络图片需要注意下载图片的路由

（2）如果域名正确了，在模拟器上可以正常下载保存，但是在真机上不可以正常下载保存，可能是下载的服务器上，需要安装SSL证书；

https://www.dkcj.cn/info/17839.html

1016 Phone Bills

目录概述： 一些小的注意点 AC代码概述： 这道题是我迄今做出来的最复杂的一道PAT了，该题被归类到排序专题下，其实还涉及到大量的字符串处理等别的我暂时也说不出的知识点。排序函数我写了两个，1是cmp&#xff0…

编程日记2024/09/08 14:50:00

C# GDI+ 简单绘图（三）仿浏览器截屏效果

感谢大家的支持,这几天从早忙到晚,一个字累呀!!!现在挺困的,但是又不习惯这么早睡觉,哎~~还是利用这个时间继续来写第三篇吧.　　前两篇已经基本向大家介绍了绘图的基本知识.那么,我就用我们上两篇所学的,做几个例子．　　我们先来做一个简单的----仿QQ截图,关于这个…

编程日记2024/09/08 14:40:00

POJ 1236 Network of Schools（tarjan）

Network of SchoolsDescription A number of schools are connected to a computer network. Agreements have been developed among those schools: each school maintains a list of schools to which it distributes software (the “receiving schools”). Note that if B …

编程日记2024/09/08 14:30:00

如何设置网页自动刷新(JSP,JS,HTML)

http://blog.163.com/ylx282006126/blog/static/59772717201111685917664/ 转载于:https://www.cnblogs.com/liuzhuqing/p/7480284.html

编程日记2024/09/08 14:20:00

1084 Broken Keyboard

两个注意的点 1.本题被归到散列专题下，但是由于是逐字符地映射到整形，可以直接把布尔型哈希数组的大小设置为ASCII的数量128，然后直接将字符作为数组下标(如果是字符串，才需要自己写一个哈希函数，将字符串映射到整形&…

编程日记2024/09/08 14:10:00

Android提示框与通知的使用

1.通知 Android 3.0以前使用的方法 1 NotificationManager nm (NotificationManager) getSystemService(NOTIFICATION_SERVICE); 2 Notification notification new Notification(R.drawable.dss, 3 "通知到了", Syste…

编程日记2024/09/08 14:00:00

nginx安全日志分析脚本的编写

https://blog.csdn.net/nextdoor6/article/details/51914966

编程日记2024/09/08 13:50:00

[转]笑死人的考试填空

高考完后又是中考，考题千奇百怪，答卷也五花八门。真佩服现在的学生啊，思维跳脱，天马行空，和我们那时候的循规蹈矩，差别太大了，呵呵。看一组语文试卷中的填空题：1.__________&#xf…

编程日记2024/09/08 13:40:00

1033 旧键盘打字

1. 非常奇怪，明明都说了用下划线替代空格，但是用scanf读入的时候就会有1个测试点没通过，换成cin.getline就通过了 2.3种情况下对应的哈希表赋值为true。1是上来就赋值，2是对于大写字母把对应小写字母也赋值，这里注意直…

编程日记2024/09/08 13:30:01

OLE 操作Excel 详解（转）

使用Excel模板进行报表的开发. 今年搞的Excel比较多，总结了一下，相信常用的操作包含的差不多了。可以首先定义一个无内容的Excel报表模板文件. 通过Tcode SMW0 上传至SAP数据库中备用.(注: Web对象应该选择’WebRFC 应用程序的二进制数据’) 开发程序…

编程日记2024/09/08 13:20:00

只需3分钟，就能轻松创建一个SpreadJS的React项目

概述SpreadJS 纯前端表格控件 V11.2(SP2) 已经全面支持了 React 的拓展。接下来我们看下如何利用3分钟快速创建一个 SpreadJS 的 React 项目。1.新建React 项目（耗时 1 Min）直接运行：npx create-react-app react-spread-sheets还不清楚什么是…

编程日记2024/09/08 13:10:00

1039 到底买不买

很典型的散列题，对于shop和eva有的珠子(即字符)，各开一个128长度的整形散列表计数，将字符作为下标读入。然后从0~127进行遍历，看每个下标下两个散列表的数量，如果有shop<eva说明不买，但是遍历仍然要继…

编程日记2024/09/08 13:00:00

什么是Linq

最近一直利用业余的时间来研究Linq，估计这样的文章在对于园子里很多牛人来说就有点小儿科了，前段时间写了一个Linq To Sql体验的小例子，感觉很简洁程序上操作体验不错，我写这些的文章目的是自我学习笔记的备用和查看，当…

编程日记2024/09/08 12:50:00

OSS正式支持IPv6公测

背景 6月20日阿里云宣布全面支持IPv6， 随后阿里云开放对象存储OSS也逐步开始向用户公测。公测步骤正常使用IPv6服务，除了OSS端支持还需要客户端支持，我们做一些检查证明客户端具备访问 IPv6的能力，再使用OSS SDK或工具通过IPv6 …

编程日记2024/09/08 12:40:00

C++中定义类的对象：用new和不用new的区别

Point p1; Point *p2new Point(); p1 由系统创建并释放，不用担心会出现内存泄露，但是生命期只有在本区域的大括号内，出了大括号就没用了。 P2 是指针，要自己释放，用不好很危险，用好了功能强大，…

编程日记2024/09/08 12:30:00

1043 输出PATest

开一个长度为6的整型数组分别记录6个字符的数量，输出的时候条件是数组中至少存在一个不为零的元素 while(PATest[0]||PATest[1]||PATest[2]||PATest[3]||PATest[4]||PATest[5]){//当6个还有一个不为0 AC代码 #include<cstdio> #include<cmath> #inc…

编程日记2024/09/08 12:20:00

[转载 js] YUI解决mouseout事件冒泡的办法

原文出处：http://design.alibaba-inc.com/?qnode/727＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝&am…

编程日记2024/09/08 12:10:00

adodb.RecordSet的属性和方法

为了更精确地跟踪数据，要用RecordSet组件创建包括数据的游标，游标就是储存在内存中的数据： rs Server.CreateObject("ADODB.RecordSet") rs.Open(sqlStr,conn,1,A) 注：A1表示读取数据；A3表示新增、改动或删…

编程日记2024/09/08 12:00:00

给女友讲讲设计模式——适配器模式（JAVA实例）5

前言有这样一个人，看到别人一个个开餐馆赚了好多钱，于是自己也很想在餐饮业这方面大展拳脚，他从别人那里学到了他们的理念，还学习到了他们真正开店的经验。不但如此，他还引进了除了吃饭意外其他的服务，例如…

编程日记2024/09/08 11:50:00

1041 Be Unique

1.依旧是散列题，开一个整形的哈希数组bets[10010]来计数，最后数目为1的，也就是unique 2.注意，可能为1的不止一个，要输出第一个输入的unique，那么需要记录下读入的顺序，可以开辟一个数组inputs[…

编程日记2024/09/08 11:40:00

SWT图像处理入门

SWT图像处理入门 Standard Widget Toolkit ( SWT ，标准窗口小部件工具箱)，是在 Eclipse 平台上使用的窗口小部件工具箱，它能向开发者提供和本机平台一致的用户界面和比较稳定的性能，也提供了强大的图像处理功能。本文首先介绍 SWT…

编程日记2024/09/08 11:30:00

MyEclipse中的快捷键

MyEclipse 快捷键1(CTRL)-------------------------------------Ctrl1 快速修复CtrlD: 删除当前行 CtrlQ 定位到最后编辑的地方 CtrlL 定位在某行 CtrlO 快速显示 OutLine CtrlT 快速显示当前类的继承结构 CtrlW 关闭当前Editer CtrlK 快速定位到下一个 CtrlE 快速显示当…

编程日记2024/09/08 11:20:00

CocoaPods原理（一）

CocoaPods介绍 CocoaPods 是开发 OS X 和 iOS 应用程序的一个第三方库的依赖管理工具。利用 CocoaPods，可以定义自己的依赖关系 (称作 pods)，并且随着时间的变化，以及在整个开发环境中对第三方库的版本管理非常方便。 CocoaPods 背后的理念主…

编程日记2024/09/08 11:10:00

1055 The World‘s Richest

开始的做法是，对于每一个case，都在整个person数组内进行遍历，把所有年龄符合要求的都放进一个临时数组，然后对临时数组进行排序，再根据要求的数目输出。但是这么做会有一个测试用例因为超时而通不过。穷则思变。于是…

编程日记2024/09/08 11:00:00

IOS时间传递机制简记

事件传递顺序：自定义View -- > UIview --> RootViewController --> UIWindow -->UIApplication -->Appdelegate -->nil 注： //分发事件，将当前的触摸事件分发给当前对象的下一个响应者 //如果当前对象处理了当前事件&am…

编程日记2024/09/08 10:50:00

HDOJ2270（How Many Friends Will Be Together With You）

#include <iostream>using namespacestd;const int MAX 1000005;intfr[MAX];intmain(){ int n, i, tt, sum; while(cin>>n) { for(i 1; i < n; i) fr[i] i;//初始化，一开始每个都是独立的，并无朋友 …

编程日记2024/09/08 10:40:00

在linux环境下重启oracle数据库，解决密码过期的问题

（1） 以oracle身份登录数据库，命令：su – oracle （2） 进入Sqlplus控制台，命令：sqlplus /nolog （3） 以系统管理员登录，命令：connect /as…

编程日记2024/09/08 10:30:00

1075 PAT Judge

1. 这一题一开始，为了同一个人的数据更新得方便，我把id从字符串转化成整数，作为数组下标，但是注意了，每个学生还是要有字符串的id属性(根据下标得到)，因为后面一旦排序，数组下标就毫无意义了。 …

编程日记2024/09/08 10:20:00

MySQL 错误代码和消息

本章列出了当你用任何主机语言调用MySQL时可能出现的错误。首先列出了服务器错误消息。其次列出了客户端程序消息。 B.1. 服务器错误代码和消息服务器错误信息来自下述源文件： 错误消息信息列在share/errmsg.txt文件中。“%d”和“%s”分别代表编号和字符…

编程日记2024/09/08 10:10:00

一步步学习汇编(8)之指令

要理解ret,retf，call指令，必须要先理清以下汇编基础知识： 一． [bx]和内存单元<?xml:namespace prefix o ns "urn:schemas-microsoft-com:office:office" />[bx]是什么呢？ 和[0]有些类似…

编程日记2024/09/08 10:00:00