在Windows上搭建Flutter开发环境

官方网址:https://flutter.io/

Flutter中文网:https://flutterchina.club/

一、使用镜像

由于在国内访问Flutter有时可能会受到限制,Flutter官方为中国开发者搭建了临时镜像,大家可以将如下环境变量加入到用户环境变量中:

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

注意: 此镜像为临时镜像,并不能保证一直可用,读者可以参考详情请参考 Using Flutter in China 以获得有关镜像服务器的最新动态。

二、系统要求

要安装并运行Flutter,您的开发环境必须满足以下最低要求:

  • 操作系统: Windows 7 或更高版本 (64-bit)
  • 磁盘空间: 400 MB (不包括Android Studio的磁盘空间).
  • 工具: Flutter 依赖Git命令行工具.Git命令行工具下载

三、获取Flutter SDK

1、安装包下载

1)、去flutter官网下载其最新可用的安装包,点击下载 ,也可以去Flutter github项目下去下载安装包
2)、将安装包zip解压到你想安装Flutter SDK的路径(如:C:\src\flutter;注意,不要将flutter安装到需要一些高权限的路径如C:\Program Files\)。
3)、在Flutter安装目录的flutter文件下找到flutter_console.bat,双击运行并启动flutter命令行,接下来,你就可以在Flutter命令行运行flutter命令了。

2、通过Git命令行工具下载

1)、配置环境变量(国内用户):
PUB_HOSTED_URL=https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

2)、克隆beta仓库到当前的系统路径中:

git clone -b beta https://github.com/flutter/flutter.git

3)、将克隆下来的项目bin目录配置到环境变量Path中:

四、运行 flutter doctor

打开一个新的命令提示符或PowerShell窗口并运行以下命令以查看是否需要安装任何依赖项来完成安装:


以下是我运行 flutter doctor 的一些显示报告,包括一些版本信息等:

五、编辑器配置

安装Android Studio

Flutter需要安装和配置Android Studio:
1.下载并安装 Android Studio 、中文社区下载:Android Studio
2.启动Android Studio,然后执行“Android Studio安装向导”。这将安装最新的Android SDK,Android SDK平台工具和Android SDK构建工具,这是Flutter为Android开发时所必需的。

安装Flutter和Dart插件

需要安装两个插件:

  • Flutter插件: 支持Flutter开发工作流 (运行、调试、热重载等).
  • Dart插件: 提供代码分析 (输入代码时进行验证、代码补全等).
    要安装这些:
  1. 打开插件首选项 (Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux).
  2. 选择 Browse repositories…, 找到 Flutter 插件并点击 install.
  3. 重启Android Studio后插件生效.

设置Android设备

要准备在Android设备上运行并测试您的Flutter应用,您需要安装Android 4.1(API level 16)或更高版本的Android设备.

  1. 在您的设备上启用 开发人员选项USB调试 。详细说明可在Android文档中找到。
  2. 使用USB将手机插入电脑。如果您的设备出现提示,请授权您的计算机访问您的设备。
  3. 在终端中,运行 flutter devices 命令以验证Flutter识别您连接的Android设备。
  4. 运行启动您的应用程序 flutter run

默认情况下,Flutter使用的Android SDK版本是基于你的 adb 工具版本。如果您想让Flutter使用不同版本的Android SDK,则必须将该 ANDROID_HOME 环境变量设置为SDK安装目录

设置Android模拟器

要准备在Android模拟器上运行并测试您的Flutter应用,请按照以下步骤操作:

  1. 在您的机器上启用 VM acceleration .
  2. 启动 Android Studio>Tools>Android>AVD Manager 并选择 Create Virtual Device.
  3. 选择一个设备并选择 Next
  4. 为要模拟的Android版本选择一个或多个系统映像,然后选择 Next. 建议使用 x86x86_64 image .
  5. 在 Emulated Performance下, 选择 Hardware - GLES 2.0 以启用 硬件加速.
  6. 验证AVD配置是否正确,然后选择 Finish
    有关上述步骤的详细信息,请参阅 Managing AVDs.
  7. 在 Android Virtual Device Manager中, 点击工具栏的 Run。模拟器启动并显示所选操作系统版本或设备的启动画面.
  8. 运行 flutter run 启动您的设备. 连接的设备名是 Android SDK built for <platform>,其中 platform 是芯片系列, 如 x86.

六、体验Flutter

创建新应用
  1. 选择 File>New Flutter Project
  2. 选择 Flutter application 作为 project 类型, 然后点击 Next
  3. 输入项目名称 (如 flutter_app), 然后点击 Next
  4. 点击 Finish


  5. 等待Android Studio安装SDK并创建项目.

上述命令创建一个Flutter项目,项目名为 flutter_app,其中包含一个使用Material 组件的简单演示应用程序。
在项目目录中,您应用程序的代码位于 lib/main.dart.

运行应用程序

  1. 定位到Android Studio 工具栏:

  2. target selector 中, 选择一个运行该应用的Android设备. 如果没有列出可用,请选择 Tools>Android>AVD Manager 并在那里创建一个

  3. 在工具栏中点击 Run图标, 或者调用菜单项 Run > Run.

  4. 如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序:


体验热重载

Flutter 可以通过 热重载(hot reload) 实现快速的开发周期,热重载就是无需重启应用程序就能实时加载修改后的代码,并且不会丢失状态(译者语:如果是一个web开发者,那么可以认为这和webpack的热重载是一样的)。简单的对代码进行更改,然后告诉IDE或命令行工具你需要重新加载(点击reload按钮),你就会在你的设备或模拟器上看到更改。

  1. 将字符串 'You have pushed the button this many times:' 更改为 'You have clicked the button this many times:'
  2. 不要按“Stop”按钮; 让您的应用继续运行。
  3. 要查看您的更改, 只需调用 Save All (cmd-s / ctrl-s), 或点击 热重载按钮 (带有闪电⚡️图标的按钮).
    你就会立即看到更新后的字符串。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,015评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,262评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,727评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,986评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,363评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,610评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,871评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,582评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,297评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,551评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,053评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,385评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,035评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,079评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,841评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,648评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,550评论 2 270

推荐阅读更多精彩内容