Flutter Fix
No Result
View All Result
  • Login
  • Register
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods
FORUM
ASK QUESTION
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods
No Result
View All Result
Flutter Fix
No Result
View All Result
Home Flutter Packages

Flutter Barcode Scanner Package Tutorial – Android & iOS

August 1, 2020
in Flutter Packages
5 min read
Flutter Barcode Scanner Package Tutorial – Android & iOS

Here’s a simple Flutter Package that helps you build a Barcode Scanner app easily. It’s a plugin for Flutter apps that adds barcode scanning support on both Android and iOS.

RELATED FLUTTER RESOURCES

Flutter Beautiful Sidebar/Navigation Bar that Collapses when clicked

A Beautiful Bottom navigation bar with bubble click effect in Flutter

A Verification Code Input Widget to get Value in Flutter.

Try example

Just clone or download the repository, open the project in Android Studio/ VS Code, open pubspec.yaml and click on Packages get.
Connect device and hit run.
To run on iPhone you need to run from Xcode first time and just make pod install in example/ios then run from Xcode.

ADVERTISEMENT

Getting Started

Follow the steps for Android and iOS

PLEASE FOLLOW iOS STEPS CAREFULLY

Android

Don’t worry, you don’t need to do anything.

iOS – Requires Swift support

Deployment target : 11

1. Fresh start:

  1. Create a new flutter project. Please check for Include swift support for iOS code.
  2. After creating new flutter project open /ios project in Xcode and set minimum deployment target to 11
    and set Swift version to 5.
  3. After setting up the deployment target and swift version, close the Xcode then run pod install in /ios in flutter project.

You have done with basic configuration now proceed to section How to use.

2. Adding to existing flutter app:

If your existing ios code is Swift then you just need to do following.

  1. Set minimum deployment target to 10 and set Swift version to 5.
  2. Close the Xcode and run pod install in /ios in flutter project.
  3. Now proceed to section How to use.

If your existing ios code is Objective-C then you need to do following.

  1. Create a new flutter project with same name at different location (Don’t forget to check Include swift support for iOS code while creating)
  2. Just copy newly created /ios folder from project and replace with existing /ios.
  3. Open ios project in Xcode and set minimum deployment target to 11 and set Swift version to 5.
  4. Run pod install in /ios

Note: If you did any changes in ios part before, you might need to make these configuration again

How to use ?

To use on iOS, you will need to add the camera usage description.
To do that open the Xcode and add camera usage description in Info.plist.

<key>NSCameraUsageDescription</key>
<string>Camera permission is required for barcode scanning.</string>

After making the changes in Android ans iOS add flutter_barcode_scanner to pubspec.yaml

dependencies:
  ...
  flutter_barcode_scanner: ^1.0.1

One time scan

  1. You need to import the package first.
import 'package:flutter_barcode_scanner/flutter_barcode_scanner.dart';

2. Then use the scanBarcode method to access barcode scanning.

String barcodeScanRes = await FlutterBarcodeScanner.scanBarcode(
                                                    COLOR_CODE, 
                                                    CANCEL_BUTTON_TEXT, 
                                                    isShowFlashIcon, 
                                                    scanMode);

Here in scanBarcode,

COLOR_CODE is hex-color which is the color of line in barcode overlay you can pass color of your choice,

CANCEL_BUTTON_TEXT is a text of cancel button on screen you can pass text of your choice and language,

isShowFlashIcon is bool value used to show or hide the flash icon,

scanMode is a enum in which user can pass any of { QR, BARCODE, DEFAULT }, if nothing is passed it will consider a default value which will be QR.
It shows the graphics overlay like for barcode and QR.

NOTE: Currently, scanMode is just to show the graphics overlay for barcode and QR. Any of this mode selected will scan both QR and barcode.

Continuous scan

  • If you need to scan barcodes continuously without closing camera use FlutterBarcodeScanner.getBarcodeStreamReceiver
    params will be same like FlutterBarcodeScanner.scanBarcode
    e.g.
FlutterBarcodeScanner.getBarcodeStreamReceiver("#ff6666", "Cancel", false, ScanMode.DEFAULT)
         .listen((barcode) { 
         /// barcode to be used
         });

Barcode scanner plugin for flutter. Supports barcode scanning for Android and iOS
https://github.com/AmolGangadhare/flutter_barcode_scanner
107 forks.
177 stars.
75 open issues.
Recent commits:

  • update readme plugin version, GitHub
  • Merge pull request #140 from timsneath/null-safeUpgrade to null safety, GitHub
  • Update to null-safe cupertino_icons, Tim Sneath
  • Switch to null-safe pedantic, Tim Sneath
  • Remove generated file, Tim Sneath

RelatedFlutter Resource

Navigation

Flutter Beautiful Sidebar/Navigation Bar that Collapses when clicked

September 15, 2020
A Beautiful Bottom navigation bar with bubble click effect in Flutter
Navigation

A Beautiful Bottom navigation bar with bubble click effect in Flutter

September 15, 2020
A Verification Code Input Widget to get Value in Flutter.
Flutter Packages

A Verification Code Input Widget to get Value in Flutter.

September 7, 2020
How to select & Pick a Countries from a List in Flutter
Flutter Packages

How to select & Pick a Countries from a List in Flutter

September 2, 2020
How To Record Audio Mp3 using Native API in Flutter
Flutter Packages

How To Record Audio Mp3 using Native API in Flutter

September 2, 2020
How To Display Flag on Your Flutter App Using the Flag Package
Flutter Packages

How To Display Flag on Your Flutter App Using the Flag Package

August 19, 2020
Next Post
Code Editor Package Flutter

How To Build A Code Editor App In Flutter with code_editor Plugin

fLUTTER ListView builder seperated

Understanding The Flutter ListView Widget

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recommended Stories

What Is A “Completer” in Flutter Dart

What Is A “Completer” in Flutter Dart

June 24, 2020
A Simple Hacker News reader app built in Flutter

A Simple Hacker News reader app built in Flutter

September 15, 2020
HOW TO USE THE FLUTTER TEXTFIELD

How to use the Flutter Text Field and Input Widget

July 13, 2020

Popular Stories

  • FLUTTER-FUTUER-APP-DEVELOPMENT

    Why Google Flutter Is the Future of Mobile App Development

    0 shares
    Share 0 Tweet 0
  • Container Widget & Box Model in Flutter – All You Need To Know

    0 shares
    Share 0 Tweet 0
  • Flutter Future, Await, and Async – All You Need To Know

    0 shares
    Share 0 Tweet 0
  • Create a Beautiful & Customized Tab/Toggle in Flutter

    0 shares
    Share 0 Tweet 0
  • Flutter Form & FormField Widget – Implementation & Example

    0 shares
    Share 0 Tweet 0
  • HOME
  • ABOUT US
  • CONTACT US
  • DMCA
  • TERMS & CONDITIONS
  • PRIVACY POLICY
Call us: +234 705 505 5426

© 2020 FlutterFix - Best Flutter Tool, Library, Source Code, Forum and Tutorials FlutterFix.

No Result
View All Result
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods

© 2020 FlutterFix - Best Flutter Tool, Library, Source Code, Forum and Tutorials FlutterFix.

Welcome Back!

Login to your account below

Forgotten Password? Sign Up

Create New Account!

Fill the forms bellow to register

All fields are required. Log In

Retrieve your password

Please enter your username or email address to reset your password.

Log In