Flutter增强现实功能插件arcore_flutter_plugin的使用

简介

arcore_flutter_plugin 是一个用于在 Flutter 应用中实现增强现实（AR）功能的插件。它基于 Google 的 ARCore 技术，允许开发者在 Android 设备上创建丰富的 AR 体验。

感谢

感谢 Oleksandr Leuschenko 的灵感和他的宝贵代码：arkit_flutter_plugin

使用方法

配置你的应用

1. 添加依赖： 在你的 pubspec.yaml 文件中添加 arcore_flutter_plugin 作为依赖：

   dependencies:
     arcore_flutter_plugin: ^0.0.1
   

2. 启用 ARCore： 按照 官方指南 启用 ARCore。

3. 添加 Sceneform 库： 在你的 build.gradle 文件中添加 Sceneform 库：

   android {
       // Sceneform 库使用了 Java 8 的语言结构。
       // 如果目标 minSdkVersion < 26，添加这些编译选项。
       compileOptions {
           sourceCompatibility 1.8
           targetCompatibility 1.8
       }
   }
   
   dependencies {
       // 提供 ArFragment 和其他 UX 资源。
       implementation 'com.google.ar.sceneform.ux:sceneform-ux:1.8.0'
   
       // 或者，使用 ArSceneView 而不依赖 UX。
       implementation 'com.google.ar.sceneform:core:1.8.0'
   }
   

4. 导入 Sceneform 插件（可选）： 按照 官方指南 导入 Sceneform 插件。

示例代码

以下是一个简单的示例代码，展示了如何在 Flutter 应用中使用 arcore_flutter_plugin 插件：

import 'package:arcore_flutter_plugin/arcore_flutter_plugin.dart';
import 'package:flutter/material.dart';
import 'package:vector_math/vector_math_64.dart' as vector;

class HelloWorld extends StatefulWidget {
  @override
  _HelloWorldState createState() => _HelloWorldState();
}

class _HelloWorldState extends State<HelloWorld> {
  ArCoreController arCoreController;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Hello World'),
        ),
        body: ArCoreView(
          onArCoreViewCreated: _onArCoreViewCreated,
        ),
      ),
    );
  }

  void _onArCoreViewCreated(ArCoreController controller) {
    arCoreController = controller;

    _addSphere(arCoreController);
    _addCylindre(arCoreController);
    _addCube(arCoreController);
  }

  void _addSphere(ArCoreController controller) {
    final material = ArCoreMaterial(
        color: Color.fromARGB(120, 66, 134, 244));
    final sphere = ArCoreSphere(
      materials: [material],
      radius: 0.1,
    );
    final node = ArCoreNode(
      shape: sphere,
      position: vector.Vector3(0, 0, -1.5),
    );
    controller.addArCoreNode(node);
  }

  void _addCylindre(ArCoreController controller) {
    final material = ArCoreMaterial(
      color: Colors.red,
      reflectance: 1.0,
    );
    final cylindre = ArCoreCylinder(
      materials: [material],
      radius: 0.5,
      height: 0.3,
    );
    final node = ArCoreNode(
      shape: cylindre,
      position: vector.Vector3(0.0, -0.5, -2.0),
    );
    controller.addArCoreNode(node);
  }

  void _addCube(ArCoreController controller) {
    final material = ArCoreMaterial(
      color: Color.fromARGB(120, 66, 134, 244),
      metallic: 1.0,
    );
    final cube = ArCoreCube(
      materials: [material],
      size: vector.Vector3(0.5, 0.5, 0.5),
    );
    final node = ArCoreNode(
      shape: cube,
      position: vector.Vector3(-0.5, 0.5, -3.5),
    );
    controller.addArCoreNode(node);
  }

  @override
  void dispose() {
    arCoreController.dispose();
    super.dispose();
  }
}

3D 对象来源

• Anonymous

文档

插件提供的类

截至 2020 年 5 月，此插件共提供了 13 个类：

• ArCoreView
• ArCoreController
• ArCoreFaceView
• ArCoreFaceController
• ArCoreSphere
• ArCoreCylinder
• ArCoreCube
• ArCoreNode
• ArCoreMaterial
• ArCoreHitTestResult
• ArCoreRotatingNode
• ArCorePlane
• ArCoreReferenceNode

ArCoreView

ArCoreView 类返回视图类型。它有以下两种视图类型：

• AUGMENTEDFACE
• STANDARDVIEW

该类有以下属性：

• onArCoreViewCreated
• enableTapRecognizer
• enableUpdateListener
• type

onArCoreViewCreated

该属性接受一个 ArCoreController。

enableTapRecognizer

初始值为 false，用作 MethodChannel 的参数。

enableUpdateListener

初始值为 false，用作 MethodChannel 的参数。

type

视图类型，默认为 STANDARDVIEW。

ArCoreController

该控制器用于通过 addArCoreNode 函数添加节点，通过 addArCoreNodeWithAnchor 函数添加带锚点的节点，以及通过 removeNode 函数移除节点。

ArCoreFaceView

这是一个状态管理小部件，返回一个 ArCoreAndroidView。它有两个属性：

• enableAugmentedFaces（初始值为 false）
• onArCoreViewCreated（接受一个带有 ArCoreController 参数的函数）

ArCoreFaceController

用于控制 FaceView，具有 dispose 和 loadMesh 方法。

ArCoreSphere

这是一个 ArCoreShape，接受 radius 和 ArCoreMaterial。

ArCoreCylinder

这是一个 ArCoreShape，接受 radius、height 和 ArCoreMaterial。

ArCoreCube

这是一个 ArCoreShape，接受 size（即 Vector3）和 ArCoreMaterial。

ArCoreNode

该小部件用于提供 position、shape、scale、rotation 和 name。

ArCoreMaterial

用于描述用户创建的虚拟对象的外观。它具有以下属性：

• color
• textureBytes
• metallic
• roughness
• reflection

ArCoreRotatingNode

这是一个具有 degreesPerSecond 属性的 ArCoreNode，该属性是一个双精度浮点值。

ArCorePlane

它接受平面的 x 和 y 坐标、ArCorePose 和 ArCorePlaneType。平面有三种类型：

• HORIZONTAL_UPWARD_FACING
• HORIZONTAL_DOWNWARD_FACING
• VERTICAL

ArCoreReferenceNode

这是一个 ArCoreNode，具有所有 ArCoreNode 的属性，还具有 objectUrl 和 object3DFileName。

objectUrl

远程渲染的 glTF 对象的 URL。

object3DFileName

资产文件夹中的 sfb 对象文件名。

完整示例应用

你可以在 example 目录 中找到一个完整的示例应用。

import 'app.dart';
import 'package:flutter/material.dart';
import 'package:arcore_flutter_plugin/arcore_flutter_plugin.dart'
    show ArCoreController;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  print('ARCORE IS AVAILABLE?');
  print(await ArCoreController.checkArCoreAvailability());
  print('\nAR SERVICES INSTALLED?');
  print(await ArCoreController.checkIsArCoreInstalled());
  runApp(App());
}

希望这些信息对你有所帮助！如果你有任何问题或需要进一步的帮助，请随时提问。