如何将Unity嵌入Flutter_flutter unity

作者：IT小白 | 2024-08-10 10:27:33

踩

flutter unity

使用 Flutter + Unity 构建增强现实体验：针对不支持 ARCore 设备的解决方案

想要为你的用户创建沉浸式体验吗？你是否遇到过某些设备不支持 ARCore 等传统 AR 库的问题？如果是这样，这篇文章就是为你准备的！

在这篇文章中，我将分享我使用 Flutter 和 Unity 创建增强现实应用程序的经验。我遇到了目标设备不满足 ARCore 最低要求的挑战，这阻止了表面检测和与虚拟对象的交互。

解决方案

为了克服这个障碍，我将 Flutter 的强大功能与 Unity 及其 Vuforia 库的灵活性相结合。我实现了一个“图像目标”和一个 C# 脚本，以便在原本不支持增强现实的设备上解锁增强现实体验。

优势：

低端设备兼容性：此解决方案允许你的应用程序在各种设备上运行，即使是那些拥有较弱摄像头的设备。
流畅的用户体验：Flutter 和 Unity 之间的集成提供流畅且无缝的用户体验。
灵活性与定制：Unity 使你能够创建复杂且定制的 AR 体验。

本文内容：

在本文中，我将逐步指导你完成使用 Flutter 和 Unity 创建增强现实应用程序的过程。

如果你想跳过 Flutter 项目的设置，可以下载 GitHub(https://github.com/vmgarciahurtado/ar_pokemon_app) 上的存储库，并跳到 Unity 项目设置部分。

Flutter 项目设置

从设置 Flutter 项目开始。请按照以下步骤操作：

在项目的根目录中创建一个名为 assets 的文件夹。
在 assets 中，创建一个名为 pokemon_list.json 的 JSON 文件，该文件将包含你想要在应用程序中包含的宝可梦列表。
在 pubspec.yaml 文件中，添加 flutter_unity_widget 包的依赖项，并将 pokemon_list.json 文件添加到 assets 部分。

在 pokemon_list.json 中：


[
    {
        "id":0,
        "name": "Bulbasaur",
        "imageUrl":"https://assets.pokemon.com/assets/cms2/img/pokedex/full/001.png"
    },
    {
        "id":1,
        "name": "Ivysaur",
        "imageUrl":"https://assets.pokemon.com/assets/cms2/img/pokedex/full/002.png"
    },
]

在 pubspec.yaml 中：


dependencies:
  flutter_unity_widget: ^2022.2.0
  assets:
    - assets/pokemon_list.json

在 lib 文件夹中，我们创建以下文件：pokemon_model.dart、pokemon_card.dart、pokemon_list.dart、pokemon_detail.dart，最后是 unity_ar_screen.dart。这些文件的内容可以在以下 GitHub(https://github.com/vmgarciahurtado/ar_pokemon_app) 存储库中找到。

Unity 项目设置

在 Flutter 项目的根目录中，我们创建一个名为 unity 的文件夹。从 Unity 应用程序中，我们创建一个新的 3D 项目，并将其保存在新创建的文件夹中。

下载必要的 Unity 包

fwu 包用于将 Unity 的更改导出到 Flutter 项目，vuforia 包用于实现增强现实。下载链接 unitypackages(https://drive.google.com/drive/folders/1lavpplnUYeODgeEaXRs1G_XgePjPuMio?usp=drive_link)。

安装包

首先将 fwu 包拖放到 Unity 项目的 Assets 部分，然后拖放 vuforia 包，并在两种情况下都点击导入*。如果出现任何更新消息，请点击 更新*。

集成 3D 模型

下载 models(https://drive.google.com/drive/u/1/folders/1lavpplnUYeODgeEaXRs1G_XgePjPuMio) 文件夹的内容，进入文件夹，并将模型拖放到 Unity 项目的 Assets 部分。

创建图像目标

在左侧面板中，右键点击，然后点击 Vuforia Engine，接着点击 Image Target。

img

下一步是将图像与 Image Target 关联起来，以便当手机摄像头检测到该图像时，显示 3D 对象。

在 Assets 部分，添加位于资源文件夹中的 pokemon_image_target.jpg 图像。
点击我们创建的 Image Target，在屏幕右侧找到 *选择* 选项，选择刚刚添加的图像。

将 3D 模型插入图像目标

我们只需进入每个模型文件夹，例如，进入 001_Bulbasaur 文件夹，并将该文件夹中的文件（在本例中为 Bulbasaur）拖放到 Image Target 上。要选择的文件是宝可梦的名称。

将脚本（PrefabController.cs）插入 Assets

将位于资源文件夹中的 PrefabController.cs 文件拖放到 Assets 中。此脚本使能够使用同一个 Image Target 在 3D 模型之间切换。

将脚本分配给用于在 3D 模型之间切换的 GameObject

在 Image Target 下面，右键点击，然后点击 创建空对象，将创建一个 GameObject，点击该对象，在屏幕右侧将出现添加组件* 选项，点击该选项，然后点击 脚本*，选择 *Prefab Controller*。选择控制器后，将出现一个空列表，点击 + 添加 3D 模型。

将所做的更改集成到 Flutter 项目中

转到 File > Build Settings > Player Settings，找到 其他设置 部分，在 脚本后端 中，将 Mono 更改为 IL2CPP，继续向下，在 最低 API 级别 中选择 7.0 (API 24)，在 目标架构 中选择 ARMv7 和 ARM64。

在 Unity 应用程序的顶部部分，点击 Flutter，然后点击 导出 Android (发布)。导出完成后，就可以运行 Flutter 项目了。

添加免费的 Vuforia 许可证

在 vuforia-licenses(https://developer.vuforia.com/vui/develop/licenses) 上登录，并在许可证部分生成一个免费许可证。在 Unity 项目中，要添加此密钥，首先转到左侧部分，右键点击 > Vuforia Engine > AR Camera，点击 AR Camera，在右侧部分点击 打开 Vuforia Engine 配置，复制生成的许可证，并将其粘贴到 应用程序许可证密钥 字段中，然后再次进行导出以将更改应用到 Flutter 项目。

资源：

完整的项目以 zip 格式项目(https://drive.google.com/file/d/175rPZixbqp9IFzojMpfwhtGDbfmF1az2/view?usp=drive_link)
存储库 GitHub(https://github.com/vmgarciahurtado/ar_pokemon_app)
包含 Unity 模型和插件的驱动器文件夹文件夹(https://drive.google.com/drive/folders/1lavpplnUYeODgeEaXRs1G_XgePjPuMio?usp=sharing)
宝可梦图片：在 url pokedex（https://www.pokemon.com/el/pokedex) 上，右键点击图片，选择复制图片地址。
flutter_unity_widget 包的文档：文档链接：https://pub.dev/packages/flutter_unity_widget
想了解更多游戏开发知识,可以扫描下方二维码,免费领取游戏开发4天训练营课程

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/IT小白/article/detail/958118