> 技术文档 > 使用VSCode配置Flutter_vscode flutter

使用VSCode配置Flutter_vscode flutter

本周(学期第四周)任务:

1.简单学习Flutter,完成环境安装与配置

2.探索Flutter与Unity集成方案

一、Flutter环境配置

根据Flutter官方文档进行环境配置:开发 Android 应用 | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

使用VS Code来安装Flutter:

1.下载开发工具

安装都参考CSDN教程

  • Git for Windows (Git命令行工具)
  • Android Studio

2.安装 Flutter SDK

使用 VS Code Flutter 扩展来安装 Flutter SDK。

打开 命令面板 (Command Palette),按下快捷键 Control + Shift + P,输入flutter,选择 Flutter: New Project,VS Code 会提示你在计算机上找到 Flutter SDK,单击 Download SDK。

下载时注意不要将 Flutter 安装到以下情况的目录或路径中:

  • 路径包含特殊字符或空格。

  • 路径需要较高的权限。

下载完成后,输出面板弹出

再等待VS初始化……等等等……初始化完点击Add SDK to PATH,就可以了。

3.配置 Android 开发

需要在 Android Studio 中配置 Android toolchain,把以下组件安装好:

  • Android SDK Platform, API 35.0.2
  • Android SDK Command-line Tools
  • Android SDK Build-Tools
  • Android SDK Platform-Tools
  • Android Emulator

按文档要求配置好后,运行模拟器时,每次运行到一半电脑就会卡住,只能强制关机,有点搞人心态还伤人电脑,所以该问题放到下篇再解决。除了不能流畅运行外,环境配置已完成。

4.检查开发配置

二、探索Flutter与Unity集成方案

查找资料,网络资料上大部分使用的是组件:Flutter-Unity widget

Flutter-Unity widget是整合Flutter与Unity的一个很关键的组件,它允许开发者在Flutter Widget内嵌入Unity应用;

Flutter-Unity widget插件的重要能力之一便是能够提供Flutter和Unity之间的双向通信;

学习资料1:【flutter笔记--组件篇】flutter_unity_widget_flutter-unity-widget-CSDN博客

学习资料2:Flutter集成Unity_flutter unity-CSDN博客

学习资料3:flutter 与unity 通信 flutter嵌入unity_mob64ca140e76c8的技术博客_51CTO博客

以及插件中的说明文档。

流程大概为:

  1. 下载配置插件

  2. 导出 Unity 项目

  3. 在flutter中嵌入unity

  4. 实现flutter和unity的通信

因为Android studio有一些问题,所以该插件的使用下篇继续。

三、项目心得

第4周任务基本完成,但仍有部分知识未经实践。配置环境耗费了大量时间,不断下载新软件,配置新环境,虽然看起来像是只配置flutter和Android studio了,但实际上根据csdn的教程和说明文档,还下载并配置了一堆软件为它们铺路。万事开头难,搭建出一个完美的环境,方便在未来丝滑地使用软件。