DEV Community

Dipen Maharjan
Dipen Maharjan

Posted on

How to create QR Code Scanner in Flutter?

In this post, we'll be using package barcode_scan2: ^4.2.0 to scan the QR Code.

Add Package to the Pubspec.yaml 

dependencies:
  flutter:
    sdk: flutter
  barcode_scan2: ^4.2.0
Enter fullscreen mode Exit fullscreen mode

Allow Access to Camera in Android and IOS

To use the QR Scanner, we have to allow the app to access the camera phone so at first we'll add the code to Android and IOS Folder,

go to:

path: android/app/src/main/AndroidManifest.xml
Enter fullscreen mode Exit fullscreen mode

and Add this line of code before application

...
<uses-permission android:name="android.permission.CAMERA" />
<application ...
Enter fullscreen mode Exit fullscreen mode

and Save.

Incase you get the multidex error
please add

path: android/app/src/build.gradle
---------------
defaultConfig {
  ....
  multiDexEnabled true
}

...
...
...

dependencies {
    implementation 'com.android.support:multidex:1.0.3'
}
Enter fullscreen mode Exit fullscreen mode

Now Moving on to the IOS Part 

path: ios/Runner/Info.plist
Enter fullscreen mode Exit fullscreen mode

add these code

<dict>
    <key>NSCameraUsageDescription</key>
    <string>Camera permission is required for barcode scanning.</string>
</dict>
Enter fullscreen mode Exit fullscreen mode

Create QR Code Dart

Once you have done that, now create a QRScannerScreen.dart file and add a button in the container or center

TextButton(
    child: Text("Scan Now"),
    onPressed: (){
        var result = await BarcodeScanner.scan(); //barcode scanner         
        print(result.type);  // The result type (barcode, cancelled, failed)
        print(result.rawContent); // The barcode content
        print(result.format); // The barcode format (as enum)
        print(result.formatNote);
    }
)
Enter fullscreen mode Exit fullscreen mode

Use Barcode: BarCode Scan 2

Top comments (1)

Collapse
 
karthidreamer profile image
Karthi Keyan •

Error: ( not just your code, also the official example pub.dev/packages/barcode_scan2/exa... )

I/ViewRootImpl@4fb4eb7MainActivity: ViewPostIme pointer 0
I/MSHandlerLifeCycle( 7185): isMultiSplitHandlerRequested: windowingMode=1 isFullscreen=true isPopOver=false isHidden=false skipActivityType=false isHandlerType=true this: DecorView@56d2a78[MainActivity]
I/ViewRootImpl@4fb4eb7MainActivity: ViewPostIme pointer 1
I/MSHandlerLifeCycle( 7185): isMultiSplitHandlerRequested: windowingMode=1 isFullscreen=true isPopOver=false isHidden=false skipActivityType=false isHandlerType=true this: DecorView@56d2a78[MainActivity]
E/flutter ( 7185): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: MissingPluginException(No implementation found for method requestCameraPermission on channel de.mintware.barcode_scan)
E/flutter ( 7185): #0 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:332:7)
E/flutter ( 7185):
E/flutter ( 7185): #1 BarcodeScanner.scan (package:barcode_scan2/platform_wrapper.dart:57:10)
E/flutter ( 7185):
E/flutter ( 7185): #2 _ContinuousScanPageState.build. (package:studentdriver/trial/continuous_scan.dart:65:24)
E/flutter ( 7185):
E/flutter ( 7185):

======== Exception caught by services library ======================================================
The following MissingPluginException was thrown while activating platform stream on channel de.mintware.barcode_scan/events:
MissingPluginException(No implementation found for method listen on channel de.mintware.barcode_scan/events)

When the exception was thrown, this was the stack:

0 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:332:7)

1 EventChannel.receiveBroadcastStream. (package:flutter/src/services/platform_channel.dart:676:9)

Read next

simplykyra profile image

Question About Large Language Models and SwiftUI

Kyra -

ssadasivuni profile image

Cloud Conundrum: Picking the Perfect Architecture for Your Code? AI to the Rescue!

Santosh Sadasivuni -

ragu27ag profile image

Skype is not sending the attachment details along with request object in group chats

RAGUNATH A.G -

sean9999 profile image

Flargs: parsimonious parsing of flags and arguments

Code Monk -