摘要:最近項(xiàng)目中需要開發(fā)生成二維碼的功能,便于宣傳和使用產(chǎn)品,于是便去研究一番,以下是研究的成果使用生成二維碼二維碼測試內(nèi)容渲染方式有方式兼容和方式計(jì)算模式背景顏色二維碼顏色二維碼糾錯級別默認(rèn)查看源碼可以看出生成的二維碼使用生成二維
最近項(xiàng)目中需要開發(fā)生成二維碼的功能,便于宣傳和使用產(chǎn)品,于是便去研究一番,以下是研究的成果
1.使用jquery生成二維碼
<span class="javascript">二維碼測試</span>
查看jquery.qrcode.min.js源碼可以看出
生成的二維碼
1)使用npm安裝vue-qr,成功后引入vue-qr
npm install vue-qr --save import VueQr from "vue-qr"
2)實(shí)現(xiàn)代碼
3)參數(shù)配置
Correct Level 0-3 容錯級別 0-3
logoSrc 嵌入至二維碼中心的 LOGO 地址
dotScale 數(shù)據(jù)區(qū)域點(diǎn)縮小比例,默認(rèn)為0.35
.......
可以看https://www.npmjs.com/package...
生成二維碼
1)導(dǎo)入maven依賴
com.google.zxing javase 3.3.1 com.google.zxing core 3.3.1
2)實(shí)現(xiàn)代碼
package com.example.spring.controller; import com.google.zxing.BarcodeFormat; import com.google.zxing.EncodeHintType; import com.google.zxing.MultiFormatWriter; import com.google.zxing.WriterException; import com.google.zxing.common.BitMatrix; import com.google.zxing.qrcode.decoder.ErrorCorrectionLevel; import org.apache.commons.lang.StringUtils; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RestController; import javax.imageio.ImageIO; import java.awt.*; import java.awt.image.BufferedImage; import java.io.File; import java.util.HashMap; import java.util.Map; import java.util.Objects; /** * 畫制定logo和制定描述的二維碼 */ @RestController public class ZXingCodeController { private static Logger logger = LoggerFactory.getLogger(ZXingCodeController.class); private static final int QRCOLOR = 0xFF000000; // 默認(rèn)是黑色 private static final int BGWHITE = 0xFFFFFFFF; // 背景顏色 private static final int WIDTH = 400; // 二維碼寬 private static final int HEIGHT = 400; // 二維碼高 @GetMapping("/create_zx_code") public void createCode(String[] args) throws WriterException { File logoFile = new File("D://logo.jpg"); File QrCodeFile = new File("D://qrcode.png"); String url = "https://www.baidu.com/"; String note = "訪問百度連接"; drawLogoQRCode(logoFile, QrCodeFile, url, note); } // 用于設(shè)置QR二維碼參數(shù) private static Maphints = new HashMap () { private static final long serialVersionUID = 1L; { put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.H);// 設(shè)置QR二維碼的糾錯級別(H為最高級別)具體級別信息 put(EncodeHintType.CHARACTER_SET, "utf-8");// 設(shè)置編碼方式 put(EncodeHintType.MARGIN, 0); } }; // 生成帶logo的二維碼圖片 public static void drawLogoQRCode(File logoFile, File codeFile, String qrUrl, String note) { try { MultiFormatWriter multiFormatWriter = new MultiFormatWriter(); // 參數(shù)順序分別為:編碼內(nèi)容,編碼類型,生成圖片寬度,生成圖片高度,設(shè)置參數(shù) BitMatrix bm = multiFormatWriter.encode(qrUrl, BarcodeFormat.QR_CODE, WIDTH, HEIGHT, hints); BufferedImage image = new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB); // 開始利用二維碼數(shù)據(jù)創(chuàng)建Bitmap圖片,分別設(shè)為黑(0xFFFFFFFF)白(0xFF000000)兩色 for (int x = 0; x < WIDTH; x++) { for (int y = 0; y < HEIGHT; y++) { image.setRGB(x, y, bm.get(x, y) ? QRCOLOR : BGWHITE); } } int width = image.getWidth(); int height = image.getHeight(); if (Objects.nonNull(logoFile) && logoFile.exists()) { // 構(gòu)建繪圖對象 Graphics2D g = image.createGraphics(); // 讀取Logo圖片 BufferedImage logo = ImageIO.read(logoFile); // 開始繪制logo圖片 g.drawImage(logo, width * 2 / 5, height * 2 / 5, width * 2 / 10, height * 2 / 10, null); g.dispose(); logo.flush(); } // 自定義文本描述 if (StringUtils.isNotEmpty(note)) { // 新的圖片,把帶logo的二維碼下面加上文字 BufferedImage outImage = new BufferedImage(400, 445, BufferedImage.TYPE_4BYTE_ABGR); Graphics2D outg = outImage.createGraphics(); // 畫二維碼到新的面板 outg.drawImage(image, 0, 0, image.getWidth(), image.getHeight(), null); // 畫文字到新的面板 outg.setColor(Color.BLACK); outg.setFont(new Font("楷體", Font.BOLD, 30)); // 字體、字型、字號 int strWidth = outg.getFontMetrics().stringWidth(note); if (strWidth > 399) { // //長度過長就截取前面部分 // 長度過長就換行 String note1 = note.substring(0, note.length() / 2); String note2 = note.substring(note.length() / 2, note.length()); int strWidth1 = outg.getFontMetrics().stringWidth(note1); int strWidth2 = outg.getFontMetrics().stringWidth(note2); outg.drawString(note1, 200 - strWidth1 / 2, height + (outImage.getHeight() - height) / 2 + 12); BufferedImage outImage2 = new BufferedImage(400, 485, BufferedImage.TYPE_4BYTE_ABGR); Graphics2D outg2 = outImage2.createGraphics(); outg2.drawImage(outImage, 0, 0, outImage.getWidth(), outImage.getHeight(), null); outg2.setColor(Color.BLACK); outg2.setFont(new Font("宋體", Font.BOLD, 30)); // 字體、字型、字號 outg2.drawString(note2, 200 - strWidth2 / 2, outImage.getHeight() + (outImage2.getHeight() - outImage.getHeight()) / 2 + 5); outg2.dispose(); outImage2.flush(); outImage = outImage2; } else { outg.drawString(note, 200 - strWidth / 2, height + (outImage.getHeight() - height) / 2 + 12); // 畫文字 } outg.dispose(); outImage.flush(); image = outImage; } image.flush(); ImageIO.write(image, "png", codeFile); logger.info("生成二維碼完畢"); } catch (Exception e) { e.printStackTrace(); } } }
運(yùn)行結(jié)果看日志
3)生成二維碼
以上便是這次對二維碼生成方式總結(jié),寫的不好地方望指點(diǎn),希望大家能受益
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/106833.html
平日學(xué)習(xí)接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼 十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認(rèn)為H5游戲和H5展示的JSer 個(gè)人整理和封裝的YU.js庫|中文詳細(xì)注釋|供新手學(xué)習(xí)使用 擴(kuò)展JavaScript語法記錄 - 掉坑初期工具 漢字拼音轉(zhuǎn)換...
平日學(xué)習(xí)接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼 十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認(rèn)為H5游戲和H5展示的JSer 個(gè)人整理和封裝的YU.js庫|中文詳細(xì)注釋|供新手學(xué)習(xí)使用 擴(kuò)展JavaScript語法記錄 - 掉坑初期工具 漢字拼音轉(zhuǎn)換...
平日學(xué)習(xí)接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼 十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認(rèn)為H5游戲和H5展示的JSer 個(gè)人整理和封裝的YU.js庫|中文詳細(xì)注釋|供新手學(xué)習(xí)使用 擴(kuò)展JavaScript語法記錄 - 掉坑初期工具 漢字拼音轉(zhuǎn)換...
平日學(xué)習(xí)接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個(gè)網(wǎng)址:http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼 十大經(jīng)典排序算法(帶動圖演示) 為什么知乎前端圈普遍認(rèn)為H5游戲和H5展示的JSer 個(gè)人整理和封裝的YU.js庫|中文詳細(xì)注釋|供新手學(xué)習(xí)使用 擴(kuò)展JavaScript語法記錄 - 掉坑初期工具 漢字拼音轉(zhuǎn)換...
閱讀 3767·2021-09-22 15:17
閱讀 1954·2021-09-22 14:59
閱讀 2353·2020-12-03 17:00
閱讀 3214·2019-08-30 15:55
閱讀 490·2019-08-30 11:23
閱讀 3492·2019-08-29 13:56
閱讀 525·2019-08-29 12:54
閱讀 2263·2019-08-29 12:49