Added semantics for QrImage (accessibility support) (#93)

* Sematics

* Added `semanticsLabel` to ReadMe

* Fix comment

Co-authored-by: Nils Reichardt <nils@sharezone.info>

README.md

@@ -68,6 +68,7 @@ Depending on your data requirements you may want to tweak the QR code output. Th
 | `embeddedImage` | ImageProvider | An `ImageProvider` that defines an image to be overlaid in the center of the QR code. |
 | `embeddedImageStyle` | QrEmbeddedImageStyle | Properties to style the embedded image. |
 | `embeddedImageEmitsError` | bool | If true, any failure to load the embedded image will trigger the `errorStateBuilder` or render an empty `Container`. If false, the QR code will be rendered and the embedded image will be ignored. |
+|`semanticsLabel`|String|`semanticsLabel` will be used by screen readers to describe the content of the QR code.|
 
 # Examples
 

lib/src/qr_image.dart

@@ -34,6 +34,7 @@ class QrImage extends StatefulWidget {
     this.gapless = true,
     this.embeddedImage,
     this.embeddedImageStyle,
+    this.semanticsLabel = 'qr code',
     this.embeddedImageEmitsError = false,
   })  : assert(QrVersions.isSupportedVersion(version)),
         _data = data,
@@ -56,6 +57,7 @@ class QrImage extends StatefulWidget {
     this.gapless = true,
     this.embeddedImage,
     this.embeddedImageStyle,
+    this.semanticsLabel = 'qr code',
     this.embeddedImageEmitsError = false,
   })  : assert(QrVersions.isSupportedVersion(version)),
         _data = null,
@@ -116,6 +118,11 @@ class QrImage extends StatefulWidget {
   /// The default is false.
   final bool embeddedImageEmitsError;
 
+  /// [semanticsLabel] will be used by screen readers to describe the content of
+  /// the qr code.
+  /// Default is 'qr code'.
+  final String semanticsLabel;
+
   @override
   _QrImageState createState() => _QrImageState();
 }
@@ -193,6 +200,7 @@ class _QrImageState extends State<QrImage> {
       edgeLength: edgeLength,
       backgroundColor: widget.backgroundColor,
       padding: widget.padding,
+      semanticsLabel: widget.semanticsLabel,
       child: CustomPaint(painter: painter),
     );
   }
@@ -210,6 +218,7 @@ class _QrImageState extends State<QrImage> {
       backgroundColor: widget.backgroundColor,
       padding: widget.padding,
       child: errorWidget,
+      semanticsLabel: widget.semanticsLabel,
     );
   }
 
@@ -244,6 +253,7 @@ class _QrContentView extends StatelessWidget {
     @required this.child,
     this.backgroundColor,
     this.padding,
+    this.semanticsLabel,
   });
 
   /// The length of both edges (because it has to be a square).
@@ -258,15 +268,22 @@ class _QrContentView extends StatelessWidget {
   /// The child widget.
   final Widget child;
 
+  /// [semanticsLabel] will be used by screen readers to describe the content of
+  /// the qr code.
+  final String semanticsLabel;
+
   @override
   Widget build(BuildContext context) {
-    return Container(
-      width: edgeLength,
-      height: edgeLength,
-      color: backgroundColor,
-      child: Padding(
-        padding: padding,
-        child: child,
+    return Semantics(
+      label: semanticsLabel,
+      child: Container(
+        width: edgeLength,
+        height: edgeLength,
+        color: backgroundColor,
+        child: Padding(
+          padding: padding,
+          child: child,
+        ),
       ),
     );
   }