ngodingdulu
Mobile DevelopmentTutorialMenengah

Membuat QR Code & Barcode Scanner dengan Flutter

Oleh Afa Hernandes2 menit baca

Daftar isi

Pada tutorial bahasa pemrograman kali ini, saya akan membagikan sebuah tutorial tentang bagaimana caranya membuat QR Code Scanner Barcode Scanner Menggunakan Flutter. berikut ini adalah contoh source code nya. silahkan dicoba dan dikembangkan dan semoga ilmunya bisa bermanfaat.

Membuat QR Code & Barcode Scanner dengan Flutter - gambar 1

Pertama Buat Project Baru, bisa menggunakan android studio ataupu Vs Code. Disini saya menggunakan Android studio. Jika rekan rekan ingin membuat menggunakan android studio jangan lupa install dulu pluginnya.

Import Library

Buka pubspec.yaml lalu tambahkan library berikut.

barcode_scan: ^2.0.0

fluttertoast: ^4.0.0

Tambahkan permission

Pada android\app\src\debug\AndroidManifest.xml tambahkan permission sebagai berikut

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

Buat halaman

Buart halaman didalam folder/package lib yaitu main.dart dan scannqrcode.dart. Untuk source code masing-masing halamannya adalah sebagai berikut.

main.dart

main.dart
import 'package:flutter/material.dart';
import 'package:scanner_qrcode/qrscanncode.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'QR Code Scanner',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: QrCodeScan(),
);
}
}

scannqrcode.dart

qrcodescanner.dart
import 'package:flutter/material.dart';
import 'package:barcode_scan/barcode_scan.dart';
import 'package:flutter/services.dart';
class QrCodeScan extends StatefulWidget {
@override
_QrCodeScanState createState() => _QrCodeScanState();
}
class _QrCodeScanState extends State<QrCodeScan> {
String result = "Waiting QR Scan Text";
Future _scanQR() async {
try {
String qrResult = await BarcodeScanner.scan();
setState(() {
result = qrResult;
});
} on PlatformException catch (ex) {
if (ex.code == BarcodeScanner.CameraAccessDenied) {
setState(() {
result = "Camera permission denied";
});
} else {
setState(() {
result = "Unkown error $ex";
});
}
} on FormatException {
setState(() {
result = "You pressed the back button before scanning anything";
});
}catch(e){
setState(() {
result = "Unkown error $e";
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
appBar: AppBar(
title: Text("QR Code Scanner"),
),
body:Center(
child:Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
result,
style: TextStyle(
fontSize: 30.0,
fontWeight: FontWeight.bold,
), textAlign: TextAlign.center,
),
new SizedBox(
height: 20.0,),
new SizedBox(
child: new RaisedButton(
onPressed: () {
_scanQR();
},
textColor: Colors.white,
child: Text('Scann QR CODE', style: TextStyle(fontSize: 20)),
),
)
],
)
)
);
}
}

Test running aplikasinya dan selesai.

Bagikan:WhatsAppTelegramXFacebook

Enter bukaEsc tutupHalaman pencarian