Working with Barcodes and QR Codes in Flutter

Ritesh Sharma
Sep 29, 2019 · 3 min read

Flutter apps are really good at performance and using Flutter we can build highly scaled apps. Flutter is found to be really sensational at various native features and services. Camera access and scanning are those native features that most of the highly scaled application needs. Barcodes and QR Codes are the official codes for product recognition and are used in various industrial aspects as well. So, working with barcodes and QR codes can be really handy for the management of data by means of unique codes.

Flutter framework helps us working with codes as it is having a package called barcode_scan. You are just required to add this package to your project by adding below line to your pubspec.yaml file.

pubspec.yaml

After that you should type the command below in your terminal:

flutter pub get

Now, create a new file home.dart in the lib folder of the project and write the below code inside that file.

home.dart file

Now, we are required to create a new file scan.dart inside the lib folder and create a StatefulWidget named ScanScreen like given below:

StatefulWidget ScanScreen

The build() of the _ScanScreen() class will be defined like below:

build() method for Stateful widget

In the above build method() for StatefulWidget, we have defined a RaisedButton() widget in the center and the UI, we are going to get will be:

Screenshot of UI

In the above code, we have referred the scan method in the onPressed() method of the RaisedButton() which will be defined like:

In the above scan() method, we have called the scan method from the BarcodeScanner class which is defined in the barcode_scan package. After calling that method, we are storing the value of scanned code to a variable and using setState() method of StatefulWidget, we are initialising that variable. And accordingly the error handling is done.

At last after all thecode in place, we will be seeing the camera screen after clicking the button:

This will automatically detect the code and we will be getting the output in the screen.

Final Words

This is an example of a QR Code or Barcode scanning and this can be really useful as a part of any big application. I feel that this article will be really helpful for the readers. So, if you find this article useful, do clap as much as you can.

Flutter Community

Articles and Stories from the Flutter Community

Ritesh Sharma

Written by

Full stack developer by profession and Data science enthusiast by passion.

Flutter Community

Articles and Stories from the Flutter Community

More From Medium

More from Flutter Community

More from Flutter Community

More from Flutter Community

Font Features in Flutter

192

More from Flutter Community

More from Flutter Community

Flutter — Shadows & glows

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade