From 7dcce70340207b2d267cfda502f672e2c3ded71c Mon Sep 17 00:00:00 2001 From: ciaochaos <1272777550@qq.com> Date: Wed, 24 Jun 2020 13:23:26 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=A0=B7=E5=BC=8F=20SP=20?= =?UTF-8?q?=E2=80=94=203?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/renderer/RendererBase.js | 6 +- src/components/renderer/RendererCircle.js | 146 ++++++++++++++++++++++ src/components/renderer/RendererFunc.js | 4 +- src/components/renderer/RendererLine.js | 4 +- src/containers/style/StyleListViewer.js | 2 + 5 files changed, 155 insertions(+), 7 deletions(-) create mode 100644 src/components/renderer/RendererCircle.js diff --git a/src/components/renderer/RendererBase.js b/src/components/renderer/RendererBase.js index 8b9331e..f2c01aa 100644 --- a/src/components/renderer/RendererBase.js +++ b/src/components/renderer/RendererBase.js @@ -118,7 +118,7 @@ function getParamInfoRect() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; @@ -164,7 +164,7 @@ function getParamInfoRound() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; @@ -210,7 +210,7 @@ function getParamInfoRandRound() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; diff --git a/src/components/renderer/RendererCircle.js b/src/components/renderer/RendererCircle.js new file mode 100644 index 0000000..b93d0bd --- /dev/null +++ b/src/components/renderer/RendererCircle.js @@ -0,0 +1,146 @@ +import React from "react"; +import {ParamTypes} from "../../constant/ParamTypes"; +import {getTypeTable, QRPointType} from "../../utils/qrcodeHandler"; +import {createRenderer} from "../style/Renderer"; +import LinkTrace from "../link/LinkTrace"; +import {RendererRect} from "./RendererBase"; +import {rand} from "../../utils/util"; + +function listPoints(qrcode, params) { + if (!qrcode) return [] + + const nCount = qrcode.getModuleCount(); + const typeTable = getTypeTable(qrcode); + const pointList = []; + const g1 = []; + const g2 = []; + + let id = 0; + let size = 0.8; + const vw = [3, -3]; + const vh = [3, -3]; + + const sq25 = "M32.048565,-1.29480038e-15 L67.951435,1.29480038e-15 C79.0954192,-7.52316311e-16 83.1364972,1.16032014 87.2105713,3.3391588 C91.2846454,5.51799746 94.4820025,8.71535463 96.6608412,12.7894287 C98.8396799,16.8635028 100,20.9045808 100,32.048565 L100,67.951435 C100,79.0954192 98.8396799,83.1364972 96.6608412,87.2105713 C94.4820025,91.2846454 91.2846454,94.4820025 87.2105713,96.6608412 C83.1364972,98.8396799 79.0954192,100 67.951435,100 L32.048565,100 C20.9045808,100 16.8635028,98.8396799 12.7894287,96.6608412 C8.71535463,94.4820025 5.51799746,91.2846454 3.3391588,87.2105713 C1.16032014,83.1364972 5.01544207e-16,79.0954192 -8.63200256e-16,67.951435 L8.63200256e-16,32.048565 C-5.01544207e-16,20.9045808 1.16032014,16.8635028 3.3391588,12.7894287 C5.51799746,8.71535463 8.71535463,5.51799746 12.7894287,3.3391588 C16.8635028,1.16032014 20.9045808,7.52316311e-16 32.048565,-1.29480038e-15 Z"; + + let otherColor = params[0]; + let posColor = params[1]; + + let available = []; + let ava2 = []; + for (let x = 0; x < nCount; x++) { + available[x] = []; + ava2[x] = []; + for (let y = 0; y < nCount; y++) { + available[x][y] = true; + ava2[x][y] = true; + } + } + + for (let y = 0; y < nCount; y++) { + for (let x = 0; x < nCount; x++) { + + if (qrcode.isDark(x, y) && typeTable[x][y] === QRPointType.POS_CENTER) { + pointList.push() + pointList.push() + } + else if (qrcode.isDark(x, y) && typeTable[x][y] === QRPointType.POS_OTHER) { + } + else { + if (available[x][y] && ava2[x][y] && x < nCount - 2 && y < nCount - 2) { + let ctn = true; + for (let i = 0; i < 3; i++) { + for (let j = 0; j < 3; j++) { + if (ava2[x + i][y + j] === false) { + ctn = false; + } + } + } + if (ctn && qrcode.isDark(x + 1, y) && qrcode.isDark(x + 1, y + 2) && qrcode.isDark(x, y + 1) && qrcode.isDark(x + 2, y + 1)) { + g1.push() + available[x + 1][y] = false; + available[x][y + 1] = false; + available[x + 2][y + 1] = false; + available[x + 1][y + 2] = false; + for (let i = 0; i < 3; i++) { + for (let j = 0; j < 3; j++) { + ava2[x + i][y + j] = false; + } + } + } + } + if (x < nCount - 1 && y < nCount - 1) { + if (qrcode.isDark(x, y) && qrcode.isDark(x + 1, y) && qrcode.isDark(x, y + 1) && qrcode.isDark(x + 1, y + 1)) { + g1.push() + for (let i = 0; i < 2; i++) { + for (let j = 0; j < 2; j++) { + available[x + i][y + j] = false; + ava2[x + i][y + j] = false; + } + } + } + } + if (available[x][y] && y < nCount - 1) { + if (qrcode.isDark(x, y) && qrcode.isDark(x, y + 1)) { + pointList.push() + available[x][y] = false; + available[x][y + 1] = false; + } + } + if (available[x][y] && x < nCount - 1) { + if (qrcode.isDark(x, y) && qrcode.isDark(x + 1, y)) { + pointList.push() + available[x][y] = false; + available[x + 1][y] = false; + } + } + if (available[x][y]) { + if (qrcode.isDark(x, y)) { + pointList.push() + } else if (typeTable[x][y] === QRPointType.DATA) { + if (rand(0,1) > 0.8) { + g2.push() + } + } + } + + + } + } + } + + for (let i = 0; i < g1.length; i++) { + pointList.push(g1[i]); + } + for (let i = 0; i < g2.length; i++) { + pointList.push(g2[i]); + } + + return pointList; +} + +function getParamInfo() { + return [ + { + type: ParamTypes.COLOR_EDITOR, + key: '圆圈颜色', + default: '#8ED1FC' + }, + { + type: ParamTypes.COLOR_EDITOR, + key: '定位点颜色', + default: '#0693E3' + } + ] +} + +const RenderCircle = createRenderer({ + listPoints: listPoints, + getParamInfo: getParamInfo, +}) + +RenderCircle.detail = ( +
圆圆圈圈
+); + +export default RenderCircle diff --git a/src/components/renderer/RendererFunc.js b/src/components/renderer/RendererFunc.js index ed9ecda..c76256f 100644 --- a/src/components/renderer/RendererFunc.js +++ b/src/components/renderer/RendererFunc.js @@ -163,7 +163,7 @@ function getParamInfoFuncA() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; @@ -217,7 +217,7 @@ function getParamInfoFuncB() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; diff --git a/src/components/renderer/RendererLine.js b/src/components/renderer/RendererLine.js index a01917d..5bc9427 100644 --- a/src/components/renderer/RendererLine.js +++ b/src/components/renderer/RendererLine.js @@ -346,7 +346,7 @@ function getParamInfoLine() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; @@ -396,7 +396,7 @@ function getParamInfoLine2() { }, { type: ParamTypes.COLOR_EDITOR, - key: '定位点点颜色', + key: '定位点颜色', default: '#000000' } ]; diff --git a/src/containers/style/StyleListViewer.js b/src/containers/style/StyleListViewer.js index 89a2c76..9f6dd23 100644 --- a/src/containers/style/StyleListViewer.js +++ b/src/containers/style/StyleListViewer.js @@ -3,6 +3,7 @@ import {changeStyle} from "../../actions"; import StyleList from "../../components/style/StyleList"; import RendererViewer from "./RendererViewer"; import RendererDSJ from "../../components/renderer/RendererDSJ"; +import RendererCircle from "../../components/renderer/RendererCircle" import RendererRandRect from "../../components/renderer/RendererRandRect"; import Renderer25D from "../../components/renderer/Renderer25D"; import RendererImage from "../../components/renderer/RendererImage"; @@ -22,6 +23,7 @@ const styles = [ {value: "A — b2", renderer: RendererFuncB}, {value: "SP — 1", renderer: RendererDSJ}, {value: "SP — 2", renderer: RendererRandRect}, + {value: "SP — 3", renderer: RendererCircle}, {value: "B1", renderer: Renderer25D}, {value: "C1", renderer: RendererImage}, {value: "C2", renderer: RendererResImage},