使用flutter如何从手持设备获取扫描码

问题描述 投票:0回答:1

如何在单击设备中的触发按钮时从手持设备获取扫描码并更新文本字段控制器中的文本。

我需要从手持设备捕获扫描码,该设备可以扫描二维码和条形码并更新文本字段控制器。请帮忙

android flutter qr-code barcode scanning
1个回答
0
投票

终于找到答案了。

每个手持设备扫描仪都必须具有内置于设备中的扫描工具或扫描相关服务工具(软件)。并且设备内必须有条形码或二维码硬件。

确保扫描仪服务已启动并正在运行。这将在手持设备中指示。

有两种不同的方法来处理这种情况。

  • 使用文本字段获取值。
  • 借助 pub dev 的 flutter_barcode_listener 包获取价值。

使用测试场 我们需要有焦点节点和文本字段控制器。 注意:如果扫描码包含多行,那么我们需要根据您的喜好将文本字段最大行数设置为 2 或更多。 (

maxLines: 2
,如果行数超过两行,这将具有滚动选项)。

注意:要使用文本字段的焦点节点进行监听,请确保文本字段具有焦点。

将其添加到同一个类中

TextEditingController scanCtrl = TextEditingController();
FocusNode focusNode = FocusNode();

  @override
  void initState() {
    focusNode.requestFocus();
    super.initState();
  }

使用此代码

TextField(
   controller: scanCtrl,
   enabled: true,
   focusNode: focusNode, // To Lisern the scan code
   autofocus: true, // To have the focus at intital
   maxLines: 2,
   onChanged: (val) {
     debugPrint("Scan Value\n$val"); // To print the scan result
     FocusScope.of(context).requestFocus(focusNode); // To re-focus the text field
   },
   decoration: InputDecoration(
     contentPadding: const EdgeInsets.only(
         left: 18, right: 18, top: 10, bottom: 10),
     fillColor: Colors.white,
     filled: true,
     isDense: true,
     hintText:"Scan Code",
     enabledBorder: const OutlineInputBorder(
       borderRadius: BorderRadius.all(Radius.circular(8)),
       borderSide: BorderSide(color: Color(0xFFA2A2A2)),
     ),
     disabledBorder: const OutlineInputBorder(
       borderRadius: BorderRadius.all(Radius.circular(8)),
       borderSide: BorderSide(color: Color(0xFFA2A2A2)),
     ),
     border: const OutlineInputBorder(
       borderRadius: BorderRadius.all(Radius.circular(8)),
     ),
     focusedBorder: const OutlineInputBorder(
       borderRadius: BorderRadius.all(Radius.circular(8)),
       borderSide: BorderSide(color: Color(0xFFA2A2A2)),
     ),
   ),
 ),

如果您想监听条形码而不是使用文本字段,请检查 Pub dev 的 flutter_barcode_listener。 Flutter 条码监听器

如果您有任何疑问,请在评论中询问。

© www.soinside.com 2019 - 2024. All rights reserved.