tsx81428 发表于 2024-10-27 11:34:39

Flutter集成Unity

前言：

最近做项目时需要用到Flutter来做跨平台开发，但是项目中又用到了假造场景，如许一来就涉及到了Unity，那么总结下来便是用AndroidStudio来创建Flutter项目，将Unity项目嵌入到Flutter项目中，本篇文章就给各人分享一下Flutter集成Unity的详细过程，下一篇再给各人分享 Flutter与Unity之间的通讯；


效果演示

   Flutter集成Unity效果图




软件环境：

AndroidStudio创建Flutter项目   
Unity3D创建Unity项目
还需准备一个插件： Flutter-Unity widget


整合Flutter和Unity的关键组件：Flutter-Unity widget

Flutter在构建跨平台移动应用方面越来越受欢迎，Unity非常适用于构建加强现实（AR）和假造现实（VR）；
Flutter-Unity widget是整合Flutter与Unity的一个很关键的组件，它允许开发者在Flutter Widget内嵌入Unity应用；
Flutter-Unity widget插件的重要能力之一便是能够提供Flutter和Unity之间的双向通讯；



一. Flutter项目



1. 准备一个Flutter项目


打开你的Android Studio，在AS中创建一个Flutter项目，取名为FlutterDemo，如下图所示：
https://i-blog.csdnimg.cn/blog_migrate/c41e5e09f31f53207a1b03d675cae357.png

 再点击Next，为Flutter项目取名，选择Flutter项目标存储位置，选择Android的开发语言，点击Finish便可以等待项目完成
 https://i-blog.csdnimg.cn/blog_migrate/ebcc39181100f9e4f6d8c57cdcd59a49.png




2. 为Flutter项目添加ndk

https://i-blog.csdnimg.cn/blog_migrate/ad8f52c54f21a7df538b7670aa475409.png



3. 为Flutter项目添加依赖

https://i-blog.csdnimg.cn/blog_migrate/e1dbb46f675f8cb39bb03fcc1262322c.png



4. Flutter项目中建立一个存放Unity项目标文件夹


点击New——> Directory，然后为文件夹取名
https://i-blog.csdnimg.cn/blog_migrate/056ffd70d3df91357b9ff7ddb8eb9eaa.png

这个文件夹的作用时存放待会创建的Unity项目
https://i-blog.csdnimg.cn/blog_migrate/2e111a5f9a2d66bc80e07583cdbd619c.png

到此为止，Flutter项目这边的工作告一段落了；然后，我们需要去创建一个Unity项目，创建Unity项目标存放路径就是Flutter项目刚刚建立的文件夹；





二. Unity项目


1. 准备一个Unity项目

留意一下Unity的存放路径不要搞错啊，Unity项目标名字可以随意的
https://i-blog.csdnimg.cn/blog_migrate/8069bb642aaa5edabce16906fced07d2.png



2. 查看Unity的NDK

这个ndk就是上文Flutter项目中需要的ndk路径
https://i-blog.csdnimg.cn/blog_migrate/7992c5643af3f91b468135143bbd4f17.png



3. 修改Unity的打包设置


切换平台，添加场景
https://i-blog.csdnimg.cn/blog_migrate/b0feeed26a1cedb44b24aaf25e59c375.png


 选择打包方式和打包设置
https://i-blog.csdnimg.cn/blog_migrate/6b6f1bc33e0b0b4c78b64c3f17b9de0c.png



4. 将Flutter-Unity Widget插件包导入到Unity项目中


Flutter-Unity widget下载地址在文章前面提供了，各人可以去下载，小编这里就带各人利用第一个包吧
https://i-blog.csdnimg.cn/blog_migrate/893f5069e672d99f2880d7ddadeb6d7d.png


点击Import，等待Flutter-Unity Widget包导入即可 
https://i-blog.csdnimg.cn/blog_migrate/eada660a4d836126eee9005a573f0d16.png

选择升级过时API，等待修改完成即可
https://i-blog.csdnimg.cn/blog_migrate/d6b66529fb0b0eede35e8ea215b64968.png



5. 修改Build脚本


打开刚刚导入的Package包中的Build脚本，并对其进行修改
https://i-blog.csdnimg.cn/blog_migrate/ed8f61b3ee5781de455145da8861fa63.png


在Build脚本中的DoBuildAndroid方法中进行修改
https://i-blog.csdnimg.cn/blog_migrate/a521ea7359c5c265607c071b900488d9.png



在Build脚本中的BuildIOS方法中修改代码 ，修改完成后，记得保存，Unity的脚本修改都不会自动保存的
https://i-blog.csdnimg.cn/blog_migrate/dd066cb806ec7cce8a2fa3a1cde99b48.png



6. 打包Export Android项目


点击Flutter后，再点击Export Android ，然后等待进度条加载完成即可，由于我们的Unity项目是建立在Flutter项目标一个文件夹中的，以是打包出来的unitylibrary会自动加载到Flutter项目中 ；
到此为止，Unity项目标配置就完成了
https://i-blog.csdnimg.cn/blog_migrate/ade423653935256bb56cf8ba43375566.png






三. 将Unity项目嵌入Android项目


1. 检查刚刚Unity项目标Export Android是否成功了

https://i-blog.csdnimg.cn/blog_migrate/c9fef6a49d0d2cdba531935ab9c7e715.png



2. 配置Android


将android / app / build.gradle中的minSdkVersion  ，tartgetSdkVersion 跟 android / unityLibrary / build.gradle的一致
comileSdkVersion改为33 ，这是由于Flutter-Unity Widget需要这么高的版本才能支持
https://i-blog.csdnimg.cn/blog_migrate/735d66f3090f919283ca0ab21ce0667e.png



3. gardle.properties 添加配置信息

https://i-blog.csdnimg.cn/blog_migrate/6b8962076fcac3a1197fd1050a0ad21a.png




4. AndroidManifest.xml中添加权限


 在android / app / src / main / AndroidManifest.xml中添加权限，如下图所示
https://i-blog.csdnimg.cn/blog_migrate/25756486f371aba8f6e8c9ef7e3e7fac.png




5. 修改main.dart文件

接下来我们为Unity编写入口程序
直接给各人上代吧，把如下代码赋值到各人的main.dart文件中
import 'package:flutter/material.dart';
import 'package:flutter_unity_widget/flutter_unity_widget.dart';


void main() {
runApp(MaterialApp(
      home: UnityDemoScreen()
));
}

class UnityDemoScreen extends StatefulWidget {

UnityDemoScreen() : super();

@override
_UnityDemoScreenState createState() => _UnityDemoScreenState();
}

class _UnityDemoScreenState extends State<UnityDemoScreen>{
static final GlobalKey<ScaffoldState> _scaffoldKey =
GlobalKey<ScaffoldState>();
late UnityWidgetController _unityWidgetController;

Widget build(BuildContext context) {

    return Scaffold(
      key: _scaffoldKey,
      body: SafeArea(
      bottom: false,
      child: WillPopScope(
          onWillPop: () async{
            // Pop the category page if Android back button is pressed.
            return true;
          },
          child: Container(
            color: Colors.blue,
            child: UnityWidget(
            onUnityCreated: onUnityCreated,
            ),
          ),
      ),
      ),
    );
}

// Callback that connects the created controller to the unity controller
void onUnityCreated(controller) {
    this._unityWidgetController = controller;
}
}


四. 效果演示

到此为止，Flutter集成Unity便已经完成了，接下来给各人看一下效果视频
   Flutter集成Unity

要是有疑问各人可以加我微信详聊 yf1553653788，下一篇再给各人分享 Flutter与Unity之间的通讯；



免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: Flutter集成Unity