Flutter 开发环境搭建-VS Code篇

1.准备环境

  • Java SDK 下载及安装
  • Flutter SDK 安装及配置环境变量 下载地址
  • 将flutter sdk解压目录下的bin目录放到系统环境变量中

检查环境,在系统终端中输入:

bash 复制代码
# 打印flutter sdk版本号
flutter --version

# 检查flutter运行环境
flutter doctor

第一次运行可能会出现部分工具没有安装。

  • Android Studio安装
  • Dart 和 Flutter插件安装(Flutter会自动安装Dart插件)

2.Android Studio 开发环境搭建

2.1 Android Studio新建Flutter

在Plugins中安装了Flutter插件后,新建项目选择新建 Flutter project,再次选择Flutter Application,等待一会即可生成项目。

2.2 安装AVD虚拟机

项目生成后需要安装AVD虚拟机,用于测试我们的应用程序,先安装虚拟机:

选择设备型号:

选择Android 版本,可以选择相对高的版本或指定版本:

设置虚拟机名称方便区分多个虚拟机:

3. VSCode中搭建开发环境

对于前端开发来讲 Android Studio可能用不习惯,可以使用VSCode来开发。

3.1 VSCode安装Flutter和Dart插件

安装Flutter一般会自动安装Dart插件。

3.2 VSCode安装和启用虚拟机

状态栏下面选择设备:

3.3 VSCode新建Flutter项目并运行

在终端中使用命令行可以创建flutter项目:

bash 复制代码
flutter create [项目名]

在项目根目录执行命令:

bash 复制代码
# flutter运行到虚拟机
flutter run

虚拟机运行效果:

相关推荐
测试工坊6 小时前
Android CPU 使用率采集入门:从原理到公式
android
恋猫de小郭6 小时前
iOS + AI ,国外一个叫 Rork Max 的项目打算替换掉 Xcode
android·前端·flutter
左手厨刀右手茼蒿8 小时前
Flutter for OpenHarmony:dart_console 打造炫酷命令行界面,绘制表格、控制光标与进度条(CLI 交互库) 深度解析与鸿蒙适配指南
flutter·交互·harmonyos·绘制
加农炮手Jinx8 小时前
Flutter for OpenHarmony 实战:疯狂头像 App(三)— 复合动画与交互反馈 — 让 UI 跃动起来
flutter·ui·交互·harmonyos·鸿蒙
王码码20358 小时前
lutter for OpenHarmony 实战之基础组件:第六十二篇 SystemChannels — 探秘 Flutter 与系统交互的捷径
flutter·microsoft·交互·harmonyos
systeminof8 小时前
从静态到实时对抗:首例安卓Runtime AI病毒解析
android·人工智能
RaidenLiu9 小时前
别再手写 MethodChannel 了:Flutter Pigeon 工程级实践与架构设计
前端·flutter·前端框架
福大大架构师每日一题9 小时前
ComfyUI v0.14.2 发布:修复 Gemini/Nano banana 节点空白图像问题,全新 MIME 匹配机制登场
android·comfyui
fengci.10 小时前
ctfshow大牛杯
android
Android系统攻城狮11 小时前
Android tinyalsa深度解析之pcm_format_to_bits调用流程与实战(一百二十三)
android·pcm·tinyalsa·音频进阶·音频性能实战