aurora
/
flutter_zxing
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request #58 from giuliatesta/main 

Scanner overlay with relative sizes
pull/62/head
Khoren Markosyan 2 years ago committed by GitHub
parent
da21f1c702 56b18e4829
commit
23c408815f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 260 additions and 110 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      example/pubspec.lock
  2. 2
      lib/flutter_zxing.dart
  3. 120
      lib/src/ui/dynamic_scanner_overlay.dart
  4. 126
      lib/src/ui/fixed_scanner_overlay.dart
  5. 3
      lib/src/ui/reader_widget.dart
  6. 117
      lib/src/ui/scanner_overlay.dart

2
example/pubspec.lock
Unescape View File

@ -148,7 +148,7 @@ packages:
path: ".."
relative: true
source: path
version: "0.8.4"
version: "0.8.5"
font_awesome_flutter:
dependency: "direct main"
description:

2
lib/flutter_zxing.dart
Unescape View File

@ -1,5 +1,7 @@
export 'generated_bindings.dart';
export 'src/logic/zxing.dart';
export 'src/ui/dynamic_scanner_overlay.dart';
export 'src/ui/fixed_scanner_overlay.dart';
export 'src/ui/reader_widget.dart';
export 'src/ui/scanner_overlay.dart';
export 'src/ui/writer_widget.dart';

120
lib/src/ui/dynamic_scanner_overlay.dart
Unescape View File

@ -0,0 +1,120 @@
import 'package:flutter/material.dart';
import '../../flutter_zxing.dart';
class DynamicScannerOverlay extends ScannerOverlay {
const DynamicScannerOverlay({
super.borderColor,
super.borderWidth,
super.overlayColor,
super.borderRadius,
super.borderLength,
this.cutOutSize = 0.5
}) : assert(cutOutSize >= 0 && cutOutSize <= 1,
'The cut out size must be between 0 and 1');
@override
final double cutOutSize;
@override
void paint(Canvas canvas, Rect rect, {TextDirection? textDirection}) {
final double width = rect.width;
final double height = rect.height;
final double borderOffset = borderWidth / 2;
final double newBorderLength = borderLength;
final double newCutOutSize = width * cutOutSize;
final Paint backgroundPaint = Paint()
..color = overlayColor
..style = PaintingStyle.fill;
final Paint borderPaint = Paint()
..color = borderColor
..style = PaintingStyle.stroke
..strokeWidth = borderWidth;
final Paint boxPaint = Paint()
..color = borderColor
..style = PaintingStyle.fill
..blendMode = BlendMode.dstOut;
final Rect cutOutRect = Rect.fromLTWH(
rect.left + width / 2 - newCutOutSize / 2 + borderOffset,
rect.top + height / 2 - newCutOutSize / 2 + borderOffset,
newCutOutSize - borderOffset * 2,
newCutOutSize - borderOffset * 2,
);
canvas
..saveLayer(
rect,
backgroundPaint,
)
..drawRect(
rect,
backgroundPaint,
)
// Draw top right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.top,
cutOutRect.right,
cutOutRect.top + newBorderLength,
topRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw top left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.top,
cutOutRect.left + newBorderLength,
cutOutRect.top + newBorderLength,
topLeft: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.bottom - newBorderLength,
cutOutRect.right,
cutOutRect.bottom,
bottomRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.bottom - newBorderLength,
cutOutRect.left + newBorderLength,
cutOutRect.bottom,
bottomLeft: Radius.circular(borderRadius),
),
borderPaint,
)
..drawRRect(
RRect.fromRectAndRadius(
cutOutRect,
Radius.circular(borderRadius),
),
boxPaint,
)
..restore();
}
@override
DynamicScannerOverlay scale(double t) {
return DynamicScannerOverlay(
borderColor: borderColor,
borderWidth: borderWidth * t,
overlayColor: overlayColor,
);
}
}

126
lib/src/ui/fixed_scanner_overlay.dart
Unescape View File

@ -0,0 +1,126 @@
import 'package:flutter/material.dart';
import '../../flutter_zxing.dart';
class FixedScannerOverlay extends ScannerOverlay {
const FixedScannerOverlay({
super.borderColor,
super.borderWidth,
super.overlayColor,
super.borderRadius,
super.borderLength,
this.cutOutSize = 250
}) : assert(borderLength <= cutOutSize / 2 + borderWidth * 2,
"Border can't be larger than ${cutOutSize / 2 + borderWidth * 2}");
@override
final double cutOutSize;
@override
void paint(Canvas canvas, Rect rect, {TextDirection? textDirection}) {
final double width = rect.width;
final double borderWidthSize = width / 2;
final double height = rect.height;
final double borderOffset = borderWidth / 2;
final double newBorderLength =
borderLength > cutOutSize / 2 + borderWidth * 2
? borderWidthSize / 2
: borderLength;
final double newCutOutSize =
cutOutSize < width ? cutOutSize : width - borderOffset;
final Paint backgroundPaint = Paint()
..color = overlayColor
..style = PaintingStyle.fill;
final Paint borderPaint = Paint()
..color = borderColor
..style = PaintingStyle.stroke
..strokeWidth = borderWidth;
final Paint boxPaint = Paint()
..color = borderColor
..style = PaintingStyle.fill
..blendMode = BlendMode.dstOut;
final Rect cutOutRect = Rect.fromLTWH(
rect.left + width / 2 - newCutOutSize / 2 + borderOffset,
rect.top + height / 2 - newCutOutSize / 2 + borderOffset,
newCutOutSize - borderOffset * 2,
newCutOutSize - borderOffset * 2,
);
canvas
..saveLayer(
rect,
backgroundPaint,
)
..drawRect(
rect,
backgroundPaint,
)
// Draw top right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.top,
cutOutRect.right,
cutOutRect.top + newBorderLength,
topRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw top left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.top,
cutOutRect.left + newBorderLength,
cutOutRect.top + newBorderLength,
topLeft: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.bottom - newBorderLength,
cutOutRect.right,
cutOutRect.bottom,
bottomRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.bottom - newBorderLength,
cutOutRect.left + newBorderLength,
cutOutRect.bottom,
bottomLeft: Radius.circular(borderRadius),
),
borderPaint,
)
..drawRRect(
RRect.fromRectAndRadius(
cutOutRect,
Radius.circular(borderRadius),
),
boxPaint,
)
..restore();
}
@override
FixedScannerOverlay scale(double t) {
return FixedScannerOverlay(
borderColor: borderColor,
borderWidth: borderWidth * t,
overlayColor: overlayColor,
);
}
}

3
lib/src/ui/reader_widget.dart
Unescape View File

@ -10,6 +10,7 @@ import 'package:flutter/material.dart';
import '../../generated_bindings.dart';
import '../logic/zxing.dart';
import '../utils/extentions.dart';
import 'fixed_scanner_overlay.dart';
import 'scanner_overlay.dart';
class ReaderWidget extends StatefulWidget {
@ -225,7 +226,7 @@ class _ReaderWidgetState extends State<ReaderWidget>
Container(
decoration: ShapeDecoration(
shape: widget.scannerOverlay ??
ScannerOverlay(
FixedScannerOverlay(
borderColor: Theme.of(context).primaryColor,
overlayColor: Colors.black45,
borderRadius: 1,

117
lib/src/ui/scanner_overlay.dart
Unescape View File

@ -1,22 +1,22 @@
import 'package:flutter/material.dart';
class ScannerOverlay extends ShapeBorder {
const ScannerOverlay({
abstract class ScannerOverlay extends ShapeBorder {
const ScannerOverlay ({
this.borderColor = Colors.red,
this.borderWidth = 3.0,
this.overlayColor = const Color.fromRGBO(0, 0, 0, 40),
this.borderRadius = 0,
this.borderLength = 40,
this.cutOutSize = 250,
}) : assert(borderLength <= cutOutSize / 2 + borderWidth * 2,
"Border can't be larger than ${cutOutSize / 2 + borderWidth * 2}");
});
final Color borderColor;
final double borderWidth;
final Color overlayColor;
final double borderRadius;
final double borderLength;
final double cutOutSize;
abstract final double cutOutSize;
@override
EdgeInsetsGeometry get dimensions => const EdgeInsets.all(10);
@ -53,108 +53,9 @@ class ScannerOverlay extends ShapeBorder {
}
@override
void paint(Canvas canvas, Rect rect, {TextDirection? textDirection}) {
final double width = rect.width;
final double borderWidthSize = width / 2;
final double height = rect.height;
final double borderOffset = borderWidth / 2;
final double newBorderLength =
borderLength > cutOutSize / 2 + borderWidth * 2
? borderWidthSize / 2
: borderLength;
final double newCutOutSize =
cutOutSize < width ? cutOutSize : width - borderOffset;
final Paint backgroundPaint = Paint()
..color = overlayColor
..style = PaintingStyle.fill;
final Paint borderPaint = Paint()
..color = borderColor
..style = PaintingStyle.stroke
..strokeWidth = borderWidth;
final Paint boxPaint = Paint()
..color = borderColor
..style = PaintingStyle.fill
..blendMode = BlendMode.dstOut;
final Rect cutOutRect = Rect.fromLTWH(
rect.left + width / 2 - newCutOutSize / 2 + borderOffset,
rect.top + height / 2 - newCutOutSize / 2 + borderOffset,
newCutOutSize - borderOffset * 2,
newCutOutSize - borderOffset * 2,
);
canvas
..saveLayer(
rect,
backgroundPaint,
)
..drawRect(
rect,
backgroundPaint,
)
// Draw top right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.top,
cutOutRect.right,
cutOutRect.top + newBorderLength,
topRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw top left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.top,
cutOutRect.left + newBorderLength,
cutOutRect.top + newBorderLength,
topLeft: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom right corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.right - newBorderLength,
cutOutRect.bottom - newBorderLength,
cutOutRect.right,
cutOutRect.bottom,
bottomRight: Radius.circular(borderRadius),
),
borderPaint,
)
// Draw bottom left corner
..drawRRect(
RRect.fromLTRBAndCorners(
cutOutRect.left,
cutOutRect.bottom - newBorderLength,
cutOutRect.left + newBorderLength,
cutOutRect.bottom,
bottomLeft: Radius.circular(borderRadius),
),
borderPaint,
)
..drawRRect(
RRect.fromRectAndRadius(
cutOutRect,
Radius.circular(borderRadius),
),
boxPaint,
)
..restore();
}
void paint(Canvas canvas, Rect rect, {TextDirection? textDirection});
@override
ShapeBorder scale(double t) {
return ScannerOverlay(
borderColor: borderColor,
borderWidth: borderWidth,
overlayColor: overlayColor,
);
}
ScannerOverlay scale(double t);
}

Write Preview
Loading…
Cancel
Save