Flutter增强现实查看插件native_ar_viewer的使用

native_ar_viewer 是一个用于在Flutter中快速查看3D模型的增强现实（AR）插件。它利用了Android的SCENE VIEW和iOS的QUICK LOOK来实现这一功能。

支持的格式

• Android: GLB, GLTF
• iOS: USDZ

示例应用程序展示了如何在Android上使用该插件。对于iOS，您需要从本地目录传递文件路径。

使用方法

调用 NativeArViewer.launchAR(modelURL) 方法即可启动AR视图。

await NativeArViewer.launchAR(modelURL);

示例应用

以下是一个完整的示例应用程序，演示如何在Android和iOS平台上使用native_ar_viewer插件。

Android 平台

可以直接传递远程3D资产的URL。

iOS 平台

必须从本地目录传递文件路径。（提供了下载远程资产的基本样本）

可能的解决方案

您可以使用flutter_downloader包下载并保存远程资产。保存后，将文件路径传递给native_ar_viewer的launchAR函数。

注意：iOS Quick Look不支持从远程URL加载资产。

完整示例代码

import 'dart:io' as io;
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter_downloader/flutter_downloader.dart';
import 'package:native_ar_viewer/native_ar_viewer.dart';
import 'package:path_provider/path_provider.dart';

String iosAssetPath = '';
String taskId = '';
String documentDirectoryPath = "";

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await FlutterDownloader.initialize();
  FlutterDownloader.registerCallback(downloadCallback);

  runApp(const MyApp());
}

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

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

class _MyAppState extends State<MyApp> {
  /// For Android Platform .glb format and for IOS .USDZ
  final String modelURL = io.Platform.isAndroid
      ? "https://firebasestorage.googleapis.com/v0/b/livvinyl-health-connector.appspot.com/o/catcow.glb?alt=media&token=da87cd4d-c9c1-4176-b1b3-a0b6fdc8734b"
      : "https://firebasestorage.googleapis.com/v0/b/livvinyl-health-connector.appspot.com/o/Astronaut.usdz?alt=media&token=833344f6-7f17-4f21-aa5c-6f9fc5313928";

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

  _downloadAssetsForIOS() async {
    await _prepareSaveDir();
    taskId = (await FlutterDownloader.enqueue(
        url: modelURL, savedDir: documentDirectoryPath))!;
    print('taskId = $taskId');
  }

  _launchAR() async {
    if (io.Platform.isAndroid) {
      await NativeArViewer.launchAR(modelURL);
    } else if (io.Platform.isIOS) {
      /// Here File name is hardcoded, in realtime application you will use your own logic to locate USDZ file.
      await NativeArViewer.launchAR("$documentDirectoryPath/Astronaut.usdz");
    } else {
      ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('Platform not supported')));
    }
  }

  Future<void> _prepareSaveDir() async {
    documentDirectoryPath = (await _findLocalPath())!;
    final savedDir = io.Directory(documentDirectoryPath);
    bool hasExisted = await savedDir.exists();
    if (!hasExisted) {
      savedDir.create();
    }
  }

  Future<String?> _findLocalPath() async =>
      (await getApplicationDocumentsDirectory()).path;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('Example app'), centerTitle: true),
        body: Padding(
          padding: const EdgeInsets.all(32.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              ElevatedButton(
                onPressed: _launchAR,
                child: const Text(
                  'Launch AR',
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

void downloadCallback(String id, DownloadTaskStatus status, int progress) async {
  print('callback: ID = $id || status = $status || progress = $progress');
}

以上代码提供了一个完整的Flutter应用程序示例，展示了如何在不同平台上使用native_ar_viewer插件查看3D模型。请根据您的具体需求进行调整和扩展。