QR Code scanner example in Flutter

<p>Implementing a QR Code Scanner in flutter is pretty simple. We are going to use font-weight: bolder;](qrscan package in this tutorial to implement a QR Code scanner. <em>The package will also allow you to scan Barcodes.</em>* Here is an illustration of what we will achieve with this tutorial. ![](../../../Uploads/a4166d14-8bb3-48fb-93f1-c52b4cf4f417.gifwidth="50%height="auto](</p> <p>Let's begin by adding the package dependency inside our font-weight: bolder;](pubspec.yaml filefont-weight: bolder;]( font-weight: bolder;](color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: "Droid Sans Mono", monospace, monospace, "Droid Sans Fallback"; font-size: 14px; line-height: 19px; white-space: pre-wrap;](color: rgb(86, 156, 214);](dependencies: color: rgb(86, 156, 214);](flutter: color: rgb(86, 156, 214);](sdk: color: rgb(206, 145, 120);](flutter color: rgb(86, 156, 214);](qrscan: color: rgb(206, 145, 120);](^0.2.17 font-size: 1rem;](Next, use the following code in yourfont-size: 1rem;]( font-size: 1rem; font-weight: bolder;](main.dart font-size: 1rem;](file to get a QR Code scanner in your flutter app.</p> <p scanResult="cameraScanResult;">Here, the font-weight: bolder;](<em>RaisedButton</em> will trigger the font-weight: bolder;](scanQRCode() methodfont-weight: bolder;](. Inside this method, we will <em>await</em> the response generated by the <em>scan() method which will be the output of the QR Code in the form of a string.</em> *color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: "Droid Sans Mono", monospace, monospace, "Droid Sans Fallback"; font-size: 14px; line-height: 19px; white-space: pre-wrap;](color: rgb(86, 156, 214);](import color: rgb(206, 145, 120);]('package:flutter/material.dart';color: rgb(86, 156, 214);](import color: rgb(206, 145, 120);]('package:qrscan/qrscan.dart' color: rgb(86, 156, 214);](as scanner; color: rgb(86, 156, 214);](void color: rgb(220, 220, 170);](main() => color: rgb(220, 220, 170);](runApp(color: rgb(78, 201, 176);](MyApp()); color: rgb(86, 156, 214);](class color: rgb(78, 201, 176);](MyApp color: rgb(86, 156, 214);](extends color: rgb(78, 201, 176);](StatelessWidget { color: rgb(86, 156, 214);](@override color: rgb(78, 201, 176);](Widget color: rgb(220, 220, 170);](build(color: rgb(78, 201, 176);](BuildContext context) { color: rgb(197, 134, 192);](return color: rgb(78, 201, 176);](MaterialApp( debugShowCheckedModeBanner: color: rgb(86, 156, 214);](false, title: color: rgb(206, 145, 120);]('QRCode Demo', home: color: rgb(78, 201, 176);](HomePage(), ); }} color: rgb(86, 156, 214);](class color: rgb(78, 201, 176);](HomePage color: rgb(86, 156, 214);](extends color: rgb(78, 201, 176);](StatefulWidget { color: rgb(86, 156, 214);](@override color: rgb(78, 201, 176);](_HomePageState color: rgb(220, 220, 170);](createState() => color: rgb(78, 201, 176);](_HomePageState();} color: rgb(86, 156, 214);](class color: rgb(78, 201, 176);](_HomePageState color: rgb(86, 156, 214);](extends color: rgb(78, 201, 176);](State { color: rgb(78, 201, 176);](String scanResult = color: rgb(206, 145, 120);](''; color: rgb(106, 153, 85);](//function that launches the scanner color: rgb(78, 201, 176);](Future color: rgb(220, 220, 170);](scanQRCode() color: rgb(197, 134, 192);](async { color: rgb(78, 201, 176);](String cameraScanResult = color: rgb(197, 134, 192);](await scanner.color: rgb(220, 220, 170);](scan(); color: rgb(220, 220, 170);](setState(() ); } color: rgb(86, 156, 214);](@override color: rgb(78, 201, 176);](Widget color: rgb(220, 220, 170);](build(color: rgb(78, 201, 176);](BuildContext context) { color: rgb(197, 134, 192);](return color: rgb(78, 201, 176);](Scaffold( appBar: color: rgb(78, 201, 176);](AppBar( title: color: rgb(78, 201, 176);](Text(color: rgb(206, 145, 120);]('QR Scan Demo'), ), body: color: rgb(78, 201, 176);](Center( child: color: rgb(78, 201, 176);](Column( mainAxisAlignment: color: rgb(78, 201, 176);](MainAxisAlignment.center, children: [ scanResult == color: rgb(206, 145, 120);]('' ? color: rgb(78, 201, 176);](Text(color: rgb(206, 145, 120);]('Result will be displayed here') : color: rgb(78, 201, 176);](Text(scanResult), color: rgb(78, 201, 176);](SizedBox(height: color: rgb(181, 206, 168);](20), color: rgb(78, 201, 176);](RaisedButton( color: color: rgb(78, 201, 176);](Colors.blue, child: color: rgb(78, 201, 176);](Text(color: rgb(206, 145, 120);]('Click To Scan', style: color: rgb(78, 201, 176);](TextStyle(color: color: rgb(78, 201, 176);](Colors.white),), onPressed: scanQRCode, ) ], ), ), ); }}</p>