Flutter华为扫码插件huawei_scan的使用

发布于 1周前 作者 htzhanglong 来自 Flutter

Flutter华为扫码插件huawei_scan的使用

简介

Huawei Scan Kit 可以扫描并解析所有主要的1D和2D条形码,并生成二维码。这可以帮助您快速地在应用程序中构建条形码扫描功能。

Scan Kit 能够自动检测、放大并识别距离较远的条形码,也可以扫描非常小的条形码。即使在光线不足或条形码反射、脏污、模糊或打印在圆柱表面等次优情况下,也能正常工作。这提高了扫描的成功率,提升了用户体验。

安装

请参阅 pub.devAppGallery Connect 配置

文档

常见问题

如果您在使用 HMS 示例时遇到问题,可以尝试以下选项:

  • Stack Overflow 是解决编程问题的最佳场所。请确保您的问题标签为 huawei-mobile-services
  • GitHub 是这些插件的官方仓库,您可以在此处提交问题或提出建议。
  • 华为开发者论坛 的 HMS Core 模块是针对一般问题和寻求建议与意见的好地方。
  • 华为开发者文档 提供了所有 HMS Core Kit 的官方文档,您可以在那里找到详细的文档。

如果您在我们的示例中遇到了错误,请提交一个 GitHub 问题到 GitHub 仓库

许可证

Huawei Scan Flutter 插件采用 Apache 2.0 License 许可证。

完整示例代码

以下是完整的示例代码,展示了如何使用 huawei_scan 插件进行扫码功能的开发。

/*
    Copyright 2020-2024. Huawei Technologies Co., Ltd. All rights reserved.

    Licensed under the Apache License, Version 2.0 (the "License")
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

        https://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.
*/

import 'package:flutter/material.dart';
import 'package:flutter/services.dart' show DeviceOrientation, SystemChrome;

import 'package:huawei_scan/huawei_scan.dart';

import 'package:huawei_scan_example/screens/build_bitmap_screen.dart';
import 'package:huawei_scan_example/screens/customized_screen_view.dart';
import 'package:huawei_scan_example/screens/decode_screen.dart';
import 'package:huawei_scan_example/screens/decode_with_bitmap_screen.dart';
import 'package:huawei_scan_example/screens/default_view_screen.dart';
import 'package:huawei_scan_example/screens/multi_processor_camera_screen.dart';
import 'package:huawei_scan_example/screens/multi_processor_screen.dart';
import 'package:huawei_scan_example/widgets/custom_button.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations(<DeviceOrientation>[
    DeviceOrientation.portraitUp,
  ]);
  runApp(const MyApp());
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
      theme: ThemeData(
        useMaterial3: true,
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
        appBarTheme: const AppBarTheme(
          backgroundColor: Colors.blue,
          foregroundColor: Colors.white,
        ),
      ),
    );
  }
}

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

  [@override](/user/override)
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  bool hmsLoggerStatus = true;

  [@override](/user/override)
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      permissionRequest();
    });
  }

  void permissionRequest() async {
    await showDialog(
      context: context,
      builder: (BuildContext context) {
        return const AlertDialog(
          title: Text(
            '关于权限',
          ),
          content: Text(
            '华为扫码插件需要一些权限才能正常工作。\n\n'
            '您需要处理这些权限才能使用华为扫码插件示例。',
          ),
        );
      },
    );
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('华为扫码插件示例'),
      ),
      body: SingleChildScrollView(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const SizedBox(
              height: 12.0,
            ),
            ConstrainedBox(
              constraints: BoxConstraints(
                maxHeight: MediaQuery.of(context).size.height / 8,
              ),
              child: Image.asset(
                'assets/scan_kit_logo.png',
                fit: BoxFit.fitHeight,
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: Column(
                children: const <Widget>[
                  Text(
                    '华为扫码插件',
                    textAlign: TextAlign.center,
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                  SizedBox(
                    height: 8.0,
                  ),
                  Text(
                    '华为扫码插件可以扫描并解析所有主要的1D和2D条形码,帮助您快速地在应用程序中构建条形码扫描功能。',
                    textAlign: TextAlign.center,
                  ),
                ],
              ),
            ),
            const SizedBox(
              height: 12.0,
            ),
            CustomButton(
              text: '启用/禁用 HMS 日志',
              onPressed: () {
                if (hmsLoggerStatus) {
                  HmsScanUtils.disableLogger();
                  hmsLoggerStatus = false;
                } else {
                  HmsScanUtils.enableLogger();
                  hmsLoggerStatus = true;
                }
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(
                    content: Text('HMS 插件日志: $hmsLoggerStatus'),
                    duration: Duration(milliseconds: 1000),
                  ),
                );
              },
            ),
            CustomButton(
              text: '默认视图模式',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) {
                      return const DefaultViewScreen();
                    },
                  ),
                );
              },
            ),
            CustomButton(
              text: '自定义视图模式',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) {
                      return const CustomizedViewScreen();
                    },
                  ),
                );
              },
            ),
            CustomButton(
              text: '生成位图',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) {
                      return const BuildBitmapScreen();
                    },
                  ),
                );
              },
            ),
            CustomButton(
              text: '通过位图解码',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) {
                      return const DecodeWithBitmapScreen();
                    },
                  ),
                );
              },
            ),
            CustomButton(
              text: '解码',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) => const DecodeScreen(),
                  ),
                );
              },
            ),
            CustomButton(
              text: '多处理器相机',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) {
                      return const MultiProcessorCameraScreen();
                    },
                  ),
                );
              },
            ),
            CustomButton(
              text: '通过多处理器解码',
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute<dynamic>(
                    builder: (BuildContext context) =>
                        const MultiProcessorScreen(),
                  ),
                );
              },
            ),
            const SizedBox(
              height: 30.0,
            ),
          ],
        ),
      ),
    );
  }
}

更多关于Flutter华为扫码插件huawei_scan的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter华为扫码插件huawei_scan的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中集成和使用huawei_scan插件来扫描二维码的示例代码。这个插件是专门为华为设备设计的,用于调用华为设备自带的扫码功能。

第一步:添加依赖

首先,你需要在pubspec.yaml文件中添加huawei_scan插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  huawei_scan: ^最新版本号  # 请替换为实际的最新版本号

然后运行flutter pub get来获取依赖。

第二步:配置Android项目

android/app/src/main/AndroidManifest.xml文件中,你需要添加必要的权限:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

    <!-- 其他配置 -->

</manifest>

此外,你还需要在android/app/build.gradle文件中配置AGConnect服务(如果你还没有配置的话):

android {
    // ...
    defaultConfig {
        // ...
        applicationId "com.example.yourapp"  // 请替换为你的应用ID
        // 在这里添加你的配置文件
        manifestPlaceholders = [
                'agconnect_app_id': '你的AGConnect应用的ID'  // 请替换为你的AGConnect应用的ID
        ]
    }
    // ...
}

dependencies {
    // ...
    implementation 'com.huawei.hms:scan:版本号'  // 请替换为实际的版本号
}

第三步:请求权限并初始化插件

在你的Flutter代码中,你需要请求必要的权限并初始化huawei_scan插件。

import 'package:flutter/material.dart';
import 'package:huawei_scan/huawei_scan.dart';
import 'package:permission_handler/permission_handler.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Huawei Scan Example'),
        ),
        body: ScanPage(),
      ),
    );
  }
}

class ScanPage extends StatefulWidget {
  @override
  _ScanPageState createState() => _ScanPageState();
}

class _ScanPageState extends State<ScanPage> {
  bool _hasCameraPermission = false;

  @override
  void initState() {
    super.initState();
    _requestCameraPermission();
  }

  Future<void> _requestCameraPermission() async {
    if (await Permission.camera.status.isGranted) {
      setState(() {
        _hasCameraPermission = true;
      });
    } else {
      Map<Permission, PermissionStatus> permissions = await Permission.camera
          .request();
      setState(() {
        _hasCameraPermission = permissions[Permission.camera] == PermissionStatus.granted;
      });
    }
  }

  Future<void> _startScan() async {
    if (_hasCameraPermission) {
      try {
        final result = await HuaweiScan.startScan(
          beepEnable: true,
          scanFormats: [HuaweiScanFormat.QR_CODE, HuaweiScanFormat.BARCODE],
        );
        if (result != null) {
          // 处理扫描结果
          print('Scan result: ${result.text}');
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(content: Text('Scanned: ${result.text}')),
          );
        }
      } catch (e) {
        print('Scan error: $e');
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(content: Text('Scan failed: ${e.toString()}')),
        );
      }
    } else {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('Camera permission is required')),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: _startScan,
        child: Text('Start Scan'),
      ),
    );
  }
}

注意事项

  1. 权限处理:在实际应用中,你需要更细致地处理权限请求和拒绝的情况。
  2. 错误处理:在调用HuaweiScan.startScan时,建议添加更多的错误处理逻辑。
  3. 版本兼容性:确保你的华为设备和华为HMS Core版本与huawei_scan插件兼容。

以上就是在Flutter中使用huawei_scan插件进行二维码扫描的基本示例。如果你遇到任何问题,请参考huawei_scan插件的官方文档或相关资源。

回到顶部