How to Open Camera and Scan QR/Bar Code Easily

Flutter makes so many complex tasks very easy to implement. Opening the camera to scan QR/Bar code and to get the scan result output is very easy, you need a single line of code to implement this feature in your Flutter app.

In this example, We have used QR Code flutter package in the project. Some of the reasons to use this package are mentioned below:

Scan BR-CODE
Scan QR-CODE
Control the flash while scanning
Apply for camera privileges
Scanning BR-CODE or QR-CODE in albums
Parse to code string with uint8list
Scanning the image of the specified path
Display the switch button of the flashlight according to the light intensity
Generate QR-CODE
Generate BR-CODE

To use this “QR code package”, add the following line on pubspec.yaml file as a dependency.

dependencies:
  flutter:
    sdk: flutter
  qrscan: ^0.2.19

Add “Camera” permissions in android/app/src/main/AndroidManifest.xml file before <application> tag.

<uses-permission android:name="android.permission.CAMERA" />

Code to implement QR Scanner on you app:

import 'package:qrscan/qrscan.dart' as scanner; 
//import scanner package file

String cameraScanResult = await scanner.scan(); 
//open camera and scan

Full Dart Code:

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:qrscan/qrscan.dart' as scanner; 
//put this line manually

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
          home: CamScanner(),
    );
  }
}

//apply this class on home: attribute at MaterialApp()
class CamScanner extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return _CamScanner(); //create state 
  }
}

class _CamScanner extends State<CamScanner>{
  String scanresult; //varaible for scan result text

  @override
  void initState() {
    scanresult = "none"; //innical value of scan result is "none"
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:Text("QR or Bar code Scanner"),
        backgroundColor: Colors.redAccent
      ),
      body:Container(
         alignment: Alignment.topCenter, //inner widget alignment to center
         padding: EdgeInsets.all(20),
         child:Column(
           children:[
                Container(
                  child: Text("Scan Result: " + scanresult)
                ),
                Container(
                  margin: EdgeInsets.only(top:30),
                  child: FlatButton( //button to start scanning
                  color: Colors.redAccent,
                  colorBrightness: Brightness.dark,
                  onPressed: () async {
                    scanresult = await scanner.scan();
                    //code to open camera and start scanning,
                    //the scan result is stored to "scanresult" varaible.
                    setState(() { //refresh UI to show the result on app
                    });
                  }, 
                  child: Text("Scan QR or Bar Code")
                  )
                )
           ],
         )
      ),
    );
  }
}