Flutter二维码扫描插件qr_hid_reader的使用

Flutter二维码扫描插件qr_hid_reader的使用

1. 插件简介

qr_hid_reader 是一个用于处理通过HID（人机接口设备）模式工作的二维码扫描器的Flutter插件。在HID模式下，扫描器像键盘一样工作，提供一系列按键事件。这个插件允许你轻松地与任何支持HID模式的扫描器进行交互。

2. 插件功能

• CommonScannerManager：最简单的管理器，仅通知扫描到的信息，不会阻止信息的传播。
• ScannerManagerWithDelegate：具有灵活定制功能的管理器，可以通过委托（delegate）来决定是否使用读取的键盘事件，并且可以通过 stopWhenCatch 参数设置传播行为。
• AndroidScannerManager：专门用于与连接到Android系统的扫描器进行交互的管理器。Android系统提供了更多关于键盘事件的信息，包括源ID，你可以设置自己的目标ID列表。

3. 使用步骤

3.1 安装插件

首先，在 pubspec.yaml 文件中添加 qr_hid_reader 依赖：

dependencies:
  qr_hid_reader: ^latest_version

请将 ^latest_version 替换为当前最新版本号。

3.2 创建管理器

根据你的需求选择合适的管理器。例如，如果你的应用程序运行在Android平台上，可以使用 AndroidScannerManager：

final manager = AndroidScannerManager();

对于其他平台，可以使用 CommonScannerManager：

final manager = CommonScannerManager();

3.3 订阅扫描结果

你可以通过 StreamBuilder 来订阅扫描到的数据，并在界面上显示：

StreamBuilder<String>(
  stream: manager.scanned,
  builder: (_, value) {
    return Text('Raw data: ${value.data}');
  },
)

4. 完整示例代码

以下是一个完整的示例代码，展示了如何在Flutter应用中使用 qr_hid_reader 插件进行二维码扫描：

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:qr_hid_reader/qr_hid_reader.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const KeyboardPage(),
    );
  }
}

class KeyboardPage extends StatefulWidget {
  const KeyboardPage({Key? key}) : super(key: key);

  [@override](/user/override)
  State<KeyboardPage> createState() => _KeyboardPageState();
}

class _KeyboardPageState extends State<KeyboardPage> {
  late final ScannerManager _detector;

  [@override](/user/override)
  void initState() {
    super.initState();

    // 根据平台选择合适的管理器
    _detector = Platform.isAndroid
        ? AndroidScannerManager(
            targetSources: [257, 769], // 指定目标源ID
          )
        : CommonScannerManager();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('QR Code Scanner'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          StreamBuilder<String>(
            stream: _detector.scanned, // 订阅扫描结果
            builder: (_, snapshot) {
              if (snapshot.hasData) {
                return Text('扫描结果: ${snapshot.data}');
              } else if (snapshot.hasError) {
                return Text('错误: ${snapshot.error}');
              } else {
                return const Text('等待扫描...');
              }
            },
          ),
          const SizedBox(height: 20),
          const TextField(
            decoration: InputDecoration(
              labelText: '输入框',
            ),
          ),
        ],
      ),
    );
  }
}