Flutter 最佳扫码插件

小鱼儿 2023-01-17 09:21 576阅读 0赞

插件已更新，支持自定义视图，具体请查看[《Flutter 最佳扫码插件——自定义视图》][Flutter]

--------------------

### 文章目录 ###

*   *  扫码
     *  用法
     *   *  配置权限
         *   *  iOS
         *  权限请求
         *  调用API
     *  例子
     *  TODO
     *  插件开发
     *  欢迎关注公众号：编程之路从0到1

长期以来，Flutter都缺乏一个简单易用，功能强大的二维码、条形码等扫码库，需要既能支持相机扫码，也能支持本地图片码识别。为了解决这个问题，我考察了原生的扫码生态，选取了功能强大的HUAWEI ScanKit SDK，对它进行了Flutter插件包封装。

华为的ScanKit SDK既支持Android，也支持iOS，同时还做了扫码界面和图库选择功能，非常适合引入Flutter世界。

仓库地址： [**flutter\_scankit**][flutter_scankit]

**中文文档**

这是一个扫码的Flutter插件，它是[HUAWEI ScanKit][] SDK的Flutter包。HUAWEI ScanKit 是一个强大的库，使用简单，对于模糊污损码识别率高，识码速度超快。

> 得益于华为在计算机视觉领域能力的积累，Scan Kit可以实现远距离码或小型码的检测和自动放大，同时针对常见复杂扫码场景（如反光、暗光、污损、模糊、柱面）做了针对性识别优化，提升扫码成功率与用户体验。

*  Android
 *  iOS

## 扫码 ##

> Scan Kit支持扫描13种全球主流的码制式。如果您的应用只处理部分特定的码制式，您也可以在接口中指定制式以便加快扫码速度。已支持的码制式：
> 
>  *  一维码：EAN-8、EAN-13、UPC-A、UPC-E、Codabar、Code 39、Code 93、Code 128、ITF-14
>  *  二维码：QR Code、Data Matrix、PDF417、Aztec

支持相机扫码和本地图片码识别。

![b097180ca7822753e8fb1dfa6daa0bf7.gif][]

## 用法 ##

1.  配置权限
2.  处理权限请求
3.  调用API

### 配置权限 ###

#### iOS ####

将以下内容添加到`ios/Runner/Info.plist`中

<key>NSCameraUsageDescription</key>
        <string>在此向用户解释你为什么需要这个权限</string>
        <key>NSPhotoLibraryUsageDescription</key>
        <string>在此向用户解释你为什么需要这个权限</string>

注意，替换`<string></string>`标签的内容，给用户一个需要该权限的理由。

安卓平台不需要配置！

### 权限请求 ###

在Flutter中，你需要一个插件库来处理权限，这里推荐我的另一个插件库：[flutter\_easy\_permission][flutter_easy_permission]，详细配置请看 [这里][Link 1]。

打开`ios/Podfile`文件，添加如下配置：

target 'Runner' do
      flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
      # Add the library of permissions you need here
      pod 'LBXPermission/Camera'
      pod 'LBXPermission/Photo'
    end

然后执行命令进行安装。

### 调用API ###

void initState() {
        super.initState();
        scanKit = FlutterScankit()
    	 ..addResultListen((val) {
    	  // 返回识别结果
          debugPrint("scanning result:$val");
        });
    
        FlutterEasyPermission().addPermissionCallback(
            onGranted: (requestCode, perms,perm) {
              startScan();
            },
            onDenied: (requestCode, perms,perm, isPermanent) {});
      }

Scan the code:

// 如果没有权限则请求
        if (!await FlutterEasyPermission.has(perms: _permissions,permsGroup: _permissionGroup)) {
              FlutterEasyPermission.request(perms: _permissions,permsGroup: _permissionGroup);
        } else {
              // 有权限则调用
              startScan();
        }
        
        
    Future<void> startScan() async {
        try {
          await scanKit.startScan(scanTypes: [ScanTypes.ALL]);
        } on PlatformException {}
    }

关于 `FlutterEasyPermission`的用法，请查看[这里][Link 1] 。

## 例子 ##

**一个完整的例子，请看 [这里][Link 2]。**

## TODO ##

SDK本身支持自定义扫码UI，但目前插件还未进行深度封装，无法支持自定义页面，后续将抽一点空，通过外接纹理方式进行深度封装，支持直接在Flutter Widget层自定义扫码界面。

## 插件开发 ##

如果您对Flutter插件开发内容感兴趣，可以去我的网校中查看[《Flutter全栈式开发-高级篇》][Flutter_-]的课程，全网独家深入解析关于Flutter插件开发的方方面面，实战讲解多个案例（包含本插件开发过程）

![qr\_adv][qr_adv]

## 欢迎关注公众号：编程之路从0到1 ##

![编程之路从0到1][0_1]

[Flutter]: https://arcticfox.blog.csdn.net/article/details/120261000
[flutter_scankit]: https://pub.flutter-io.cn/packages/flutter_scankit
[HUAWEI ScanKit]: https://developer.huawei.com/consumer/cn/doc/development/HMSCore-Guides-V5/service-introduction-0000001050041994-V5
[b097180ca7822753e8fb1dfa6daa0bf7.gif]: /images/20221021/aded208a3b3c4de7b4682fa638e3e80a.png
[flutter_easy_permission]: https://pub.dev/packages/flutter_easy_permission
[Link 1]: https://github.com/arcticfox1919/flutter_easy_permission
[Link 2]: https://github.com/arcticfox1919/flutter-scankit/blob/main/example/lib/main.dart
[Flutter_-]: http://m.study.163.com/provider/480000001855430/index.htm?share=2&shareId=480000001855430
[qr_adv]: /images/20221021/909f37f9a4684d9490ae4c2b83d49121.png
[0_1]: /images/20221021/21feb4a1245044eb9328b128760e1d3f.png