Flutter增强现实插件ar_quido的使用

Ahoy, me hearties! Set sail on the high seas of image recognition with our Flutter plugin. Arrr! 🦜

🏴‍☠️ ar_quido 🏴‍☠️

Image recognition using Augmented Reality (AR) features for mobile Flutter apps. It uses EasyAR Sense on Android and native ARKit on iOS.

The plugin has been built by Flutter Division at Miquido Software development company.

Getting started 🚢

添加依赖

1. 从命令行添加：

   flutter pub add ar_quido
   flutter pub get
   

2. 直接在 pubspec.yaml 中添加：

   dependencies:
      ar_quido: 0.2.0
   

Android 配置

由于 Android 版本依赖于 EasyAR 解决方案，你需要在其页面上 注册 并获得 “Sense Authorization” License Key。可以通过 EasyAR Dashboard 完成。

之后，在 Android Manifest 文件中提供该 key 作为 application 的元数据：

<meta-data
           android:name="com.miquido.ar_quido.API_KEY"
           android:value="<YOUR_SENSE_LICENSE_KEY>" />

Proguard

默认情况下，proguard 会从发布版本中删除 EasyAR 库文件。要解决这个问题，请将以下代码添加到 android/app/src/proguard-rules.pro 文件中（如果不存在则创建）：

-keep class cn.easyar.** { *; }
-keepattributes SourceFile,LineNumberTable
-keep public class * extends java.lang.Exception

iOS 配置

ARKit 使用设备摄像头，因此不要忘记在 Info.plist 中提供 NSCameraUsageDescription：

<key>NSCameraUsageDescription</key>
<string>Describe why your app needs camera (AR) here.</string>

此外，请确保项目设置中的部署目标至少为 14.0。在 ios/Podfile 中设置相同的版本：

platform :ios, '15.0'

Usage 🌴

1. 将参考图像放在 assets/reference_images 目录中（确保在 pubspec.yaml 中引用它们）。

   • 请注意，目前只支持 .jpg 图像。

2. 在视图代码中放置 ARQuidoView 小部件。至少提供一个你要检测的图像名称数组（通过 referenceImageNames 属性）和一个检测到图像时的回调（通过 onImageDetected 属性）：

   ARQuidoView(
      referenceImageNames: const ['applandroid'],
      onImageDetected: (imageName) {
        // handle detected image
      },
   ),
   

3. 这样就完成了 ⚓

请参阅 示例 以获取更多信息。您也可以在 API 文档 中查看详细信息。

示例代码

以下是完整的示例 demo：

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

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Permission.camera.request();
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String? _recognizedImage;

  void _onImageDetected(BuildContext context, String? imageName) {
    if (imageName != null && _recognizedImage != imageName) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(
          content: Text('Recognized image: $imageName'),
          duration: const Duration(milliseconds: 2500),
        ),
      );
    }
    setState(() {
      _recognizedImage = imageName;
    });
  }

  void _onDetectedImageTapped(BuildContext context, String? imageName) {
    if (imageName != null) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(
          content: Text('Tapped on image: $imageName'),
          duration: const Duration(milliseconds: 1500),
        ),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Builder(
          builder: (context) {
            return Stack(
              children: [
                ARQuidoView(
                  referenceImageNames: const ['applandroid'],
                  onImageDetected: (imageName) =>
                      _onImageDetected(context, imageName),
                  onDetectedImageTapped: (imageName) =>
                      _onDetectedImageTapped(context, imageName),
                ),
              ],
            );
          },
        ),
      ),
    );
  }
}

以上是 ar_quido 插件的基本使用方法和示例代码。希望对您有所帮助！