🔧非常炫酷的二维码生成工具:)

🔧非常炫酷的二维码生成工具:)

又快要到快乐的周末了,我霸都丶傲天回来了鸭鸭~~

这一次的新作品是一个非常炫酷的二维码生成器、话不多说,先展示作品。

LOL灵魂上单
2019年不再流浪的罗小黑
宗介斯嘎~


是滴,这次的作品就是生成这样二维码的工具。

支持平台

  • 桌面端浏览器
  • 微信、手机端浏览器

工具网址

在线生成非常炫酷的二维码工具 awesome-qrcode

开源代码地址

源代码:AJLoveChina/awesome-qrcode

工作原理

这个工具依赖了下面俩个非常火爆的Javascript库

其实讲真的,AwesomeQRCode已经完成了我这个工具大部分的功能,可是它使用起来不方便。而且它始终是一个工具库,而不是一款真正面向用户的产品,尤其是我特别喜欢这样文案搭配二维码的风格,可是它并没有这样的功能。

因为工作比较忙的原因,这个工具我已经开发了好几个月了,之前一直没有发布是因为创建最终图片的时候偶尔会产生图片变形,主要是那个html2canvas实在是不稳定,当然我做了一些小trick操作,让最终生成图片的时候尽量不会变形。(但是10次操作可能会有1次失败)

然后简单说一下使用教程吧~

1、打开工具网址(各位老铁可以直接微信扫描下方的二维码尝试)

2、输入文字

3、指定背景图片

4、输入tip文字

5、然后下载,完成!bingo!

桌面浏览器会自动弹出图片下载,手机端(微信)需要自己长按图片保存哦~~

6、最后我们上传刚刚生成的图片看看效果

结果有点尴尬,我们最后这个二维码图片居然识别不出来。现场翻水水了~~

原因是这样子的,因为这张图片的内容色彩太丰富了,导致不管哪一种打点的颜色都会与背景色重合度比较高。打点就是二维码上面那一个个方块,方块的颜色是由工具自动识别图片然后选择的最佳的一个颜色。这个颜色主要区分与背景色,这样才能方便二维码识别。

所以我的建议是各位老铁在尝试的时候

  • 选择背景色不是那么丰富的图片
  • 或者二维码的内容输入少一些,少一些内容的话,对应的二维码打点就比较大,就容易识别

关于这个工具的使用问题,源代码开发问题,第三方库使用问题都可以在下方评论哦~

后续更新

目前这个工具还处于开发阶段,后面在我有时间的时候,我打算支持

  • 支持切换unicode字符图案
  • 支持GIF动图二维码的生成
  • 目前只想到这些,如果你有好的想法可以评论下方发给我

今天自己不镇楼了,周末要做点好吃的,各位老铁~

最后谢谢 @天边的爱 提供的UI支持~

so,就是这样,bye~~


本文中使用的unicode图案来自傲天君的另一个作品

awesome-unicode-symbolajlovechina.github.io图标

编辑于 2019-12-20