Flutter : 여러 키-값 쌍으로 qrcode 생성

Nov 30 2020

나는 flutter에서 qrcode를 생성하려고합니다. 3 개의 키-값을 같은 곳에 추가해야합니다. 그래서 스캔하면 관련 정보를 얻을 수 있습니다.

이것은 qrcode 스캔 작업을 처음 수행하는 것입니다. 그래서 나는 그것에 대해 전혀 모른다.

다음은 코드입니다.

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

abid:value, txnid:value, uid: valueqrcode 를 전달해야합니다 . 따라서 스캔 할 때 값을 가져와 그에 따라 사용할 수 있습니다.

답변

1 chunhunghan Nov 30 2020 at 09:00

아래에 붙여 넣기 실행 2 전체 코드를 복사
할 수 있습니다. JSON
1 단계 : JSON형식으로
QR 이미지 생성하기 1 단계의 전체 코드를 사용하여 QR 이미지를 생성 할 수 있습니다.

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

2 단계 : QR 이미지가 올바른 JSON 문자열을 생성하는지 확인

3 단계 :이 QR 이미지를 스캔하면 JSON문자열이 표시되고로 구문 분석 할 수 있습니다. 아래 payloadFromJson에서 구문 분석 할 전체 코드를 참조하십시오.JSON