Skip to content

Commit da19817

Browse files
committed
Add dotSacale for Timing and Alignment
Add dotSacale for Timing and Alignment
1 parent 2841c4c commit da19817

File tree

4 files changed

+132
-30
lines changed

4 files changed

+132
-30
lines changed

QRCode.js

Lines changed: 104 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
*
44
* React Native QRCode generation component. Can generate standard QRCode image or base64 image data url text. Cross-browser QRCode generator for pure javascript. Support Dot style, Logo, Background image, Colorful, Title etc. settings. support binary mode.
55
*
6-
* Version 3.7.3
6+
* Version 3.8.0
77
*
88
* @author [ [email protected] ]
99
*
@@ -1161,10 +1161,20 @@ Drawing.prototype.draw = function(oQRCode) {
11611161

11621162
var eye = oQRCode.getEye(row, col); // { isDark: true/false, type: PO_TL, PI_TL, PO_TR, PI_TR, PO_BL, PI_BL };
11631163

1164+
var nowDotScale = _htOption.dotScale;
11641165
if (eye) {
11651166
// Is eye
11661167
bIsDark = eye.isDarkBlock;
11671168
var type = eye.type;
1169+
if (eye.type == 'AO') {
1170+
nowDotScale = _htOption.dotScaleAO;
1171+
} else if (eye.type == 'AI') {
1172+
nowDotScale = _htOption.dotScaleAI;
1173+
} else {
1174+
nowDotScale = 1;
1175+
}
1176+
1177+
11681178

11691179
// PX_XX, PX, colorDark, colorLight
11701180
var eyeColorDark = _htOption[type] || _htOption[type.substring(0, 2)] || _htOption.colorDark;
@@ -1173,49 +1183,53 @@ Drawing.prototype.draw = function(oQRCode) {
11731183
_oContext.strokeStyle = bIsDark ? eyeColorDark : _htOption.colorLight;
11741184
_oContext.fillStyle = bIsDark ? eyeColorDark : _htOption.colorLight;
11751185

1176-
_oContext.fillRect(nLeft, _htOption.titleHeight + nTop, nWidth, nHeight);
1177-
1186+
// _oContext.fillRect(nLeft, _htOption.titleHeight + nTop, nWidth, nHeight);
1187+
_oContext.fillRect(nLeft + nWidth * (1 - nowDotScale) / 2, _htOption.titleHeight +
1188+
nTop + nHeight * (1 -
1189+
nowDotScale) / 2, nWidth * nowDotScale, nHeight *
1190+
nowDotScale);
11781191
} else {
11791192
_oContext.lineWidth = 0;
11801193
_oContext.strokeStyle = bIsDark ? _htOption.colorDark : _htOption.colorLight;
11811194
_oContext.fillStyle = bIsDark ? _htOption.colorDark : _htOption.colorLight;
11821195

1183-
var nowDotScale = _htOption.dotScale;
1196+
if (_htOption.backgroundImage) {
1197+
1198+
if (_htOption.autoColor) {
1199+
_oContext.strokeStyle = bIsDark ? autoColorDark : autoColorLight;
1200+
_oContext.fillStyle = bIsDark ? autoColorDark : autoColorLight;
1201+
} else {
1202+
_oContext.fillStyle = bIsDark ? _htOption.colorDark : _htOption.colorLight;
1203+
_oContext.strokeStyle = _oContext.fillStyle;
1204+
}
1205+
1206+
} else {
1207+
_oContext.strokeStyle = _oContext.fillStyle;
1208+
1209+
1210+
}
11841211
if (row == 6) {
11851212
// Timing Pattern
1186-
nowDotScale = 1;
1187-
var timingHColorDark = _htOption.timing_H || _htOption.timing || _htOption.colorDark;
1188-
_oContext.fillStyle = bIsDark ? timingHColorDark : _htOption.colorLight;
1189-
_oContext.strokeStyle = _oContext.fillStyle;
1213+
nowDotScale = _htOption.dotScaleTiming_H;
1214+
11901215
_oContext.fillRect(nLeft + nWidth * (1 - nowDotScale) / 2, _htOption.titleHeight + nTop +
11911216
nHeight * (1 -
11921217
nowDotScale) / 2, nWidth * nowDotScale, nHeight * nowDotScale);
11931218
} else if (col == 6) {
11941219
// Timing Pattern
1195-
nowDotScale = 1;
1196-
var timingVColorDark = _htOption.timing_V || _htOption.timing || _htOption.colorDark;
1197-
_oContext.fillStyle = bIsDark ? timingVColorDark : _htOption.colorLight;
1198-
_oContext.strokeStyle = _oContext.fillStyle;
1220+
nowDotScale = _htOption.dotScaleTiming_V;
11991221
_oContext.fillRect(nLeft + nWidth * (1 - nowDotScale) / 2, _htOption.titleHeight + nTop +
12001222
nHeight * (1 -
12011223
nowDotScale) / 2, nWidth * nowDotScale, nHeight * nowDotScale);
12021224
} else {
12031225

12041226
if (_htOption.backgroundImage) {
12051227

1206-
if (_htOption.autoColor) {
1207-
_oContext.strokeStyle = bIsDark ? autoColorDark : autoColorLight;
1208-
_oContext.fillStyle = bIsDark ? autoColorDark : autoColorLight;
1209-
} else {
1210-
_oContext.fillStyle = bIsDark ? _htOption.colorDark : _htOption.colorLight;
1211-
_oContext.strokeStyle = _oContext.fillStyle;
1212-
}
12131228
_oContext.fillRect(nLeft + nWidth * (1 - nowDotScale) / 2, _htOption.titleHeight + nTop +
12141229
nHeight * (1 -
12151230
nowDotScale) / 2, nWidth * nowDotScale, nHeight * nowDotScale);
12161231

12171232
} else {
1218-
_oContext.strokeStyle = _oContext.fillStyle;
12191233

12201234
_oContext.fillRect(nLeft + nWidth * (1 - nowDotScale) / 2, _htOption.titleHeight + nTop +
12211235
nHeight * (1 -
@@ -1369,10 +1383,18 @@ function QRCode(canvas, vOption) {
13691383
colorLight: "#ffffff",
13701384
correctLevel: QRErrorCorrectLevel.H,
13711385

1372-
dotScale: 1, // Must be greater than 0, less than or equal to 1. default is 1
1386+
dotScale: 1, // For body block, must be greater than 0, less than or equal to 1. default is 1
1387+
1388+
dotScaleTiming: 1, // Dafault for timing block , must be greater than 0, less than or equal to 1. default is 1
1389+
dotScaleTiming_H: undefined, // For horizontal timing block, must be greater than 0, less than or equal to 1. default is 1
1390+
dotScaleTiming_V: undefined, // For vertical timing block, must be greater than 0, less than or equal to 1. default is 1
1391+
1392+
dotScaleA: 1, // Dafault for alignment block, must be greater than 0, less than or equal to 1. default is 1
1393+
dotScaleAO: undefined, // For alignment outer block, must be greater than 0, less than or equal to 1. default is 1
1394+
dotScaleAI: undefined, // For alignment inner block, must be greater than 0, less than or equal to 1. default is 1
13731395

13741396
quietZone: 0,
1375-
quietZoneColor: 'transparent',
1397+
quietZoneColor: "rgba(0,0,0,0)",
13761398

13771399
title: "",
13781400
titleFont: "bold 16px Arial",
@@ -1452,6 +1474,66 @@ function QRCode(canvas, vOption) {
14521474
" , is invalidate, dotScale must greater than 0, less than or equal to 1, now reset to 1. ")
14531475
this._htOption.dotScale = 1;
14541476
}
1477+
1478+
if (this._htOption.dotScaleTiming < 0 || this._htOption.dotScaleTiming > 1) {
1479+
console.warn(this._htOption.dotScaleTiming +
1480+
" , is invalidate, dotScaleTiming must greater than 0, less than or equal to 1, now reset to 1. "
1481+
)
1482+
this._htOption.dotScaleTiming = 1;
1483+
}
1484+
if (this._htOption.dotScaleTiming_H) {
1485+
if (this._htOption.dotScaleTiming_H < 0 || this._htOption.dotScaleTiming_H > 1) {
1486+
console.warn(this._htOption.dotScaleTiming_H +
1487+
" , is invalidate, dotScaleTiming_H must greater than 0, less than or equal to 1, now reset to 1. "
1488+
)
1489+
this._htOption.dotScaleTiming_H = 1;
1490+
}
1491+
} else {
1492+
this._htOption.dotScaleTiming_H = this._htOption.dotScaleTiming;
1493+
}
1494+
1495+
if (this._htOption.dotScaleTiming_V) {
1496+
if (this._htOption.dotScaleTiming_V < 0 || this._htOption.dotScaleTiming_V > 1) {
1497+
console.warn(this._htOption.dotScaleTiming_V +
1498+
" , is invalidate, dotScaleTiming_V must greater than 0, less than or equal to 1, now reset to 1. "
1499+
)
1500+
this._htOption.dotScaleTiming_V = 1;
1501+
}
1502+
} else {
1503+
this._htOption.dotScaleTiming_V = this._htOption.dotScaleTiming;
1504+
}
1505+
1506+
1507+
1508+
if (this._htOption.dotScaleA < 0 || this._htOption.dotScaleA > 1) {
1509+
console.warn(this._htOption.dotScaleA +
1510+
" , is invalidate, dotScaleA must greater than 0, less than or equal to 1, now reset to 1. "
1511+
)
1512+
this._htOption.dotScaleA = 1;
1513+
}
1514+
if (this._htOption.dotScaleAO) {
1515+
if (this._htOption.dotScaleAO < 0 || this._htOption.dotScaleAO > 1) {
1516+
console.warn(this._htOption.dotScaleAO +
1517+
" , is invalidate, dotScaleAO must greater than 0, less than or equal to 1, now reset to 1. "
1518+
)
1519+
this._htOption.dotScaleAO = 1;
1520+
}
1521+
} else {
1522+
this._htOption.dotScaleAO = this._htOption.dotScaleA;
1523+
}
1524+
if (this._htOption.dotScaleAI) {
1525+
if (this._htOption.dotScaleAI < 0 || this._htOption.dotScaleAI > 1) {
1526+
console.warn(this._htOption.dotScaleAI +
1527+
" , is invalidate, dotScaleAI must greater than 0, less than or equal to 1, now reset to 1. "
1528+
)
1529+
this._htOption.dotScaleAI = 1;
1530+
}
1531+
} else {
1532+
this._htOption.dotScaleAI = this._htOption.dotScaleA;
1533+
}
1534+
1535+
1536+
14551537
if (this._htOption.backgroundImageAlpha < 0 || this._htOption.backgroundImageAlpha > 1) {
14561538
console.warn(this._htOption.backgroundImageAlpha +
14571539
" , is invalidate, backgroundImageAlpha must between 0 and 1, now reset to 1. ")

0 commit comments

Comments
 (0)