Flutter: buat kode qr dengan beberapa pasangan nilai kunci

Nov 30 2020

Saya mencoba menghasilkan kode qr dalam flutter. Saya perlu menambahkan tiga nilai kunci yang sama. Jadi, ketika saya memindainya, saya bisa mendapatkan informasi yang relevan.

Ini adalah pertama kalinya saya mengerjakan pemindaian kode qr. Jadi, saya tidak tahu tentang itu.

Ini kodenya.

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),
                    ),
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Saya harus abid:value, txnid:value, uid: valuememasukkan kode QR. Jadi, ketika saya memindainya, saya dapat mengambil nilainya dan menggunakannya dengan benar.

Jawaban

1 chunhunghan Nov 30 2020 at 09:00

Anda dapat menyalin dan menempel menjalankan 2 kode lengkap di bawah ini
Anda dapat menggunakan JSON
Langkah 1: Hasilkan Gambar QR dengan JSONformat
Anda dapat melihat kode lengkap Langkah 1 untuk menghasilkan Gambar QR di bawah ini

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}
  }
  ''';

Langkah 2: Periksa Gambar QR untuk menghasilkan string JSON yang benar

Langkah 3: Saat memindai Gambar QR ini, Anda akan mendapatkan JSONstring dan Anda dapat mengurai payloadFromJson, lihat kode lengkap untuk mengurai di JSONbawah

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}");

demo kerja untuk Langkah 1

kode lengkap Langkah 1 untuk menghasilkan Gambar 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,
      ),
    );
  }
}

kode lengkap untuk diurai 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),
      ),
    );
  }
}

keluaran dari parse JSON

I/flutter ( 6945): abid 1
I/flutter ( 6945): uid 2
I/flutter ( 6945): txnid 3