- Notifications
You must be signed in to change notification settings - Fork556
A universal Flutter barcode and QR code scanner using CameraX/ML Kit for Android, AVFoundation/Apple Vision for iOS & macOS, and ZXing for web.
License
juliansteenbakker/mobile_scanner
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
A fast and lightweight Flutter plugin for scanning barcodes and QR codes using the device’s camera. It supports multiple barcode formats, real-time detection, and customization options for an optimized scanning experience on multiple platforms.
- Fast barcode and QR code scanning
- Supports multiple barcode formats
- Real-time detection
- Customizable camera and scanner behavior
See theexamples for runnable examples of various usages, such as the basic usage, applying a scan window, or retrieving images from the barcodes.
Android | iOS | macOS | Web | Linux | Windows |
---|---|---|---|---|---|
✔ | ✔ | ✔ | ✔ | ❌ | ❌ |
See the example app for detailed implementation information.
Features | Android | iOS | macOS | Web |
---|---|---|---|---|
analyzeImage | ✔️ | ✔️ | ✔️ | ❌ |
returnImage | ✔️ | ✔️ | ✔️ | ❌ |
scanWindow | ✔️ | ✔️ | ✔️ | ❌ |
autoZoom | ✔️ | ❌ | ❌ | ❌ |
Add the dependency in yourpubspec.yaml
file:
dependencies: mobile_scanner: ^<latest_version>
Then run:
flutter pub get
This package uses by default thebundled version of MLKit Barcode-scanning for Android. This version is immediately available to the device. But it will increase the size of the app by approximately 3 to 10 MB.
The alternative is to use theunbundled version of MLKit Barcode-scanning for Android. This version is downloaded on first use via Google Play Services. It increases the app size by around 600KB.
You can read more about the difference between the two versions here.
To use theunbundled version of the MLKit Barcode-scanning, add the following line to your/android/gradle.properties
file:
dev.steenbakker.mobile_scanner.useUnbundled=true
Since the scanner needs to use the camera, add the following keys to your Info.plist file. (located in /ios/Runner/Info.plist)
NSCameraUsageDescription - describe why your app needs access to the camera. This is called Privacy - Camera Usage Description in the visual editor.
If you want to use the local gallery feature fromimage_picker, you also need to add the following key.
NSPhotoLibraryUsageDescription - describe why your app needs permission for the photo library. This is called Privacy - Photo Library Usage Description in the visual editor.
Example,
<key>NSCameraUsageDescription</key><string>This app needs camera access to scan QR codes</string><key>NSPhotoLibraryUsageDescription</key><string>This app needs photos access to get QR code from photo library</string>
Ensure that you granted camera permission in XCode -> Signing & Capabilities:
As of version 5.0.0 adding the barcode scanning library script to theindex.html
is no longer required,as the script is automatically loaded on first use.
If a different mirror is needed to load the barcode scanning library,the source URL can be set beforehand.
import'package:flutter/foundation.dart';import'package:mobile_scanner/mobile_scanner.dart';finalString scriptUrl=// ...if (kIsWeb) {MobileScannerPlatform.instance.setBarcodeLibraryScriptUrl(scriptUrl);}
Import the package withpackage:mobile_scanner/mobile_scanner.dart
. The only required parameter isonDetect
, which returns the scanned barcode or qr code.
MobileScanner( onDetect: (result) {print(result.barcodes.first.rawValue); },),
If you want more control over the scanner, you need to create a newMobileScannerController
controller. The controller contains multiple parameters to adjust the scanner.
finalMobileScannerController controller=MobileScannerController( cameraResolution: size, detectionSpeed: detectionSpeed, detectionTimeoutMs: detectionTimeout, formats: selectedFormats, returnImage: returnImage, torchEnabled:true, invertImage: invertImage, autoZoom: autoZoom,);
MobileScanner( controller: controller, onDetect: (result) {print(result.barcodes.first.rawValue); },);
If you want to pause the scanner when the app is inactive, you need to useWidgetsBindingObserver
.
First, provide aStreamSubscription
for the barcode events. Also, make sure to create aMobileScannerController
withautoStart
set to false, since we will be handling the lifecycle ourself.
finalMobileScannerController controller=MobileScannerController( autoStart:false,);StreamSubscription<Object?>? _subscription;
Then, ensure that yourState
class mixes inWidgetsBindingObserver
, to handle lifecyle changes, and add the required logic to thedidChangeAppLifecycleState
function:
classMyStateextendsState<MyStatefulWidget>withWidgetsBindingObserver {// ...@overridevoiddidChangeAppLifecycleState(AppLifecycleState state) {// If the controller is not ready, do not try to start or stop it.// Permission dialogs can trigger lifecycle changes before the controller is ready.if (!controller.value.hasCameraPermission) {return; }switch (state) {caseAppLifecycleState.detached:caseAppLifecycleState.hidden:caseAppLifecycleState.paused:return;caseAppLifecycleState.resumed:// Restart the scanner when the app is resumed.// Don't forget to resume listening to the barcode events. _subscription= controller.barcodes.listen(_handleBarcode);unawaited(controller.start());caseAppLifecycleState.inactive:// Stop the scanner when the app is paused.// Also stop the barcode events subscription.unawaited(_subscription?.cancel()); _subscription=null;unawaited(controller.stop()); } }// ...}
Then, start the scanner invoid initState()
:
@overridevoidinitState() {super.initState();// Start listening to lifecycle changes.WidgetsBinding.instance.addObserver(this);// Start listening to the barcode events. _subscription= controller.barcodes.listen(_handleBarcode);// Finally, start the scanner itself.unawaited(controller.start());}
Finally, dispose of the theMobileScannerController
when you are done with it.
@overrideFuture<void>dispose()async {// Stop listening to lifecycle changes.WidgetsBinding.instance.removeObserver(this);// Stop listening to the barcode events.unawaited(_subscription?.cancel()); _subscription=null;// Dispose the widget itself.super.dispose();// Finally, dispose of the controller.await controller.dispose();}
About
A universal Flutter barcode and QR code scanner using CameraX/ML Kit for Android, AVFoundation/Apple Vision for iOS & macOS, and ZXing for web.