Flutter: générer un QRcode avec plusieurs paires clé-valeur
J'essaye de générer qrcode en flutter. J'ai besoin d'ajouter trois valeurs-clés dans le même. Ainsi, lorsque je le scanne, je peux obtenir les informations pertinentes.
C'est la première fois que je travaille sur un scan de qrcode. Donc, je n'en ai aucune idée.
Voici le code.
import 'package:DTG/utils/d_app_drwaer.dart';
import 'package:DTG/utils/d_appbar.dart';
import 'package:auto_route/auto_route.dart';
import 'package:device_info/device_info.dart';
import 'package:flutter/material.dart';
import 'package:qr_flutter/qr_flutter.dart';
import 'package:flutter/services.dart';
import 'dart:async';
import 'dart:typed_data';
import 'dart:ui';
import 'dart:io';
import 'package:flutter/rendering.dart';
import 'package:path_provider/path_provider.dart';
class BookingQRGenerate extends StatefulWidget {
final int abid;
final int uid;
final int txnid;
const BookingQRGenerate({
@required this.abid,
@required this.uid,
@required this.txnid,
});
@override
State<StatefulWidget> createState() => BookingQRGenerateState();
}
class BookingQRGenerateState extends State<BookingQRGenerate> {
static const double _topSectionTopPadding = 20.0;
static const double _topSectionBottomPadding = 20.0;
static const double _topSectionHeight = 20.0;
GlobalKey globalKey = new GlobalKey();
String _dataString = "Hello from this QR";
bool physicaldevice;
var deviceid;
int dtguid;
int abid;
int txnid;
int uid;
@override
void initState() {
super.initState();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
deviceInfo();
}
Future<void> deviceInfo() async {
abid = widget.abid;
txnid = widget.txnid;
uid = widget.uid;
DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();
AndroidDeviceInfo androidInfo = await deviceInfo.androidInfo;
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: myAppBar(),
endDrawer: myDrawer(),
body: _contentWidget(),
);
}
_contentWidget() {
final bodyHeight = MediaQuery.of(context).size.height -
MediaQuery.of(context).viewInsets.bottom;
return Container(
color: const Color(0xFFFFFFFF),
child: Column(
children: <Widget>[
Card(
elevation: 8.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(13.0)),
color: Colors.blueGrey[300],
child: ListTile(
title: Text(
'QRCode',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w500,
),
),
),
),
Padding(
padding: const EdgeInsets.only(
top: _topSectionTopPadding,
left: 20.0,
right: 10.0,
bottom: _topSectionBottomPadding,
),
child: Container(
height: _topSectionHeight,
child: Row(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[],
),
),
),
Expanded(
child: Container(
color: Colors.black26,
child: Center(
child: RepaintBoundary(
key: globalKey,
child: QrImage(
data: _dataString,
// data:abid, uid, txnid,
version: QrVersions.auto,
size: 320,
gapless: false,
embeddedImage: AssetImage('assets/img/logo.png'),
embeddedImageStyle: QrEmbeddedImageStyle(
size: Size(80, 80),
),
),
),
),
),
),
],
),
);
}
}
J'ai besoin de passer abid:value, txnid:value, uid: value
le qrcode. Ainsi, lorsque je le scanne, je peux récupérer la valeur et l'utiliser en conséquence.
Réponses
Vous pouvez copier coller le code complet de l'exécution 2 ci-dessous
Vous pouvez utiliser l' JSON
étape 1: Générer une image QR au JSON
format
Vous pouvez voir le code complet de l'étape 1 pour générer l'image QR ci-dessous
home: BookingQRGenerate(
abid: 1,
uid: 2,
txnid: 3,
),
...
Future<void> deviceInfo() async {
abid = widget.abid;
txnid = widget.txnid;
uid = widget.uid;
_dataString = '''
{
"abid": ${widget.abid}, "uid":${widget.uid},
"txnid":${widget.txnid}
}
''';
Étape 2: Vérifiez que l'image QR produit la chaîne JSON correcte

Étape 3: Lorsque vous numérisez cette image QR, vous obtiendrez une JSON
chaîne et vous pourrez analyser avec payloadFromJson
, voir le code complet à analyser JSON
ci-dessous
Payload payloadFromJson(String str) => Payload.fromJson(json.decode(str));
...
Payload payload = payloadFromJson(jsonString);
print("abid ${payload.abid}");
print("uid ${payload.uid}"); print("txnid ${payload.txnid}");
démo de travail pour l'étape 1

code complet de l'étape 1 pour générer une image QR
import 'package:flutter/material.dart';
import 'package:device_info/device_info.dart';
import 'package:qr_flutter/qr_flutter.dart';
import 'package:flutter/services.dart';
import 'dart:async';
import 'dart:typed_data';
import 'dart:ui';
import 'dart:io';
import 'package:flutter/rendering.dart';
//import 'package:path_provider/path_provider.dart';
class BookingQRGenerate extends StatefulWidget {
final int abid;
final int uid;
final int txnid;
const BookingQRGenerate({
@required this.abid,
@required this.uid,
@required this.txnid,
});
@override
State<StatefulWidget> createState() => BookingQRGenerateState();
}
class BookingQRGenerateState extends State<BookingQRGenerate> {
static const double _topSectionTopPadding = 20.0;
static const double _topSectionBottomPadding = 20.0;
static const double _topSectionHeight = 20.0;
GlobalKey globalKey = new GlobalKey();
String _dataString = "Hello from this QR";
bool physicaldevice;
var deviceid;
int dtguid;
int abid;
int txnid;
int uid;
@override
void initState() {
super.initState();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
deviceInfo();
}
Future<void> deviceInfo() async {
abid = widget.abid;
txnid = widget.txnid;
uid = widget.uid;
_dataString = '''
{
"abid": ${widget.abid}, "uid":${widget.uid},
"txnid":${widget.txnid} } '''; print("_dataString $_dataString");
DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();
AndroidDeviceInfo androidInfo = await deviceInfo.androidInfo;
}
@override
Widget build(BuildContext context) {
return Scaffold(
//appBar: myAppBar(),
//endDrawer: myDrawer(),
body: _contentWidget(),
);
}
_contentWidget() {
final bodyHeight = MediaQuery.of(context).size.height -
MediaQuery.of(context).viewInsets.bottom;
return Container(
color: const Color(0xFFFFFFFF),
child: Column(
children: <Widget>[
Card(
elevation: 8.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(13.0)),
color: Colors.blueGrey[300],
child: ListTile(
title: Text(
'QRCode',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w500,
),
),
),
),
Padding(
padding: const EdgeInsets.only(
top: _topSectionTopPadding,
left: 20.0,
right: 10.0,
bottom: _topSectionBottomPadding,
),
child: Container(
height: _topSectionHeight,
child: Row(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[],
),
),
),
Expanded(
child: Container(
color: Colors.black26,
child: Center(
child: RepaintBoundary(
key: globalKey,
child: QrImage(
data: _dataString,
// data:abid, uid, txnid,
version: QrVersions.auto,
size: 320,
gapless: false,
embeddedImage: AssetImage('assets/img/logo.png'),
embeddedImageStyle: QrEmbeddedImageStyle(
size: Size(80, 80),
),
),
),
),
),
),
],
),
);
}
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: BookingQRGenerate(
abid: 1,
uid: 2,
txnid: 3,
),
);
}
}
code complet à analyser JSON
import 'package:flutter/material.dart';
import 'dart:convert';
Payload payloadFromJson(String str) => Payload.fromJson(json.decode(str));
String payloadToJson(Payload data) => json.encode(data.toJson());
class Payload {
Payload({
this.abid,
this.txnid,
this.uid,
});
int abid;
int txnid;
int uid;
factory Payload.fromJson(Map<String, dynamic> json) => Payload(
abid: json["abid"],
txnid: json["txnid"],
uid: json["uid"],
);
Map<String, dynamic> toJson() => {
"abid": abid,
"txnid": txnid,
"uid": uid,
};
}
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
String jsonString = '''
{
"abid": 1,
"uid":2,
"txnid":3
}
''';
Payload payload = payloadFromJson(jsonString);
print("abid ${payload.abid}"); print("uid ${payload.uid}");
print("txnid ${payload.txnid}"); setState(() { _counter++; }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Text( 'You have pushed the button this many times:', ), Text( '$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
sortie de l'analyse JSON
I/flutter ( 6945): abid 1
I/flutter ( 6945): uid 2
I/flutter ( 6945): txnid 3