【window10】Dart+Android Studio+Flutter安装及运行

  • [安装Dart SDK](#安装Dart SDK)
  • [安装Android Studio](#安装Android Studio)
  • 安装Flutter
  • [在Android Studio中创建并运行Flutter项目](#在Android Studio中创建并运行Flutter项目)

安装前,请配置好你的jdk环境,准备好你的梯子~

安装Dart SDK

浅浅了解一下Dart:

Dart 诞生于2011年,是由谷歌开发的一种强类型、跨平台的客户端开发语言。Dart是一种简洁、清晰、基于类的面向对象的语言,具有专门为客户端优化、高生产力、快速高效、可移植(兼容ARM/x86)、易学的OO编程风格和原生支持响应式编程(Stream & Future)等优秀特性。它是基于JavaScript的,但是结构比JavaScript多。
Dart SDK官网: Dart SDK官网

安装步骤:

1、在获取Dart SDK我们可以看到可以通过命令行安装包两种方式来安装Dart SDK(使用命令行会默认安装到C盘),我是直接下载安装包的:

这个安装包的下载链接是需要自己拼的,官网上有说明。

下载解压完之后,就是这样一个文件夹,我放在D盘里了:

2、配置Dart SDK环境:windows搜索【查看高级系统设置】--->【环境变量】--->【用户变量】--->【path】路径配置到dart-sdk文件夹下的bin目录

3、【windows+R】打开黑窗口,通过dart --version查看是否安装成功。

4、建议在VS code编译器中安装两个插件,方便开发使用:


安装Android Studio

1、由于我之前安装Android Studio的时候没有保存步骤图,所以给大家找了一篇详细的安装教程:
Android Studio 安装配置教程 - Windows(详细版)

2、安装完之后,需要装两个插件,方便开发使用:


安装Flutter

浅浅了解一下Flutter:

Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。

  • 具有跨平台开发特性,目前已经支持IOS、Android、Web、Windows、macOS、Linux等;
  • 热重载特性大大提高了开发效率;
  • 自绘UI引擎和编译成原生代码的方式,使得系统的运行时的高性能成为了可能;
  • 使用Dart语言,目前已经支持同时编译成Web端代码。

Flutter官网:Flutter官网

安装步骤:

1、在Flutter安装中,选择你要安装的系统,我安装的是Windows版本

解压完压缩包之后是这个样子,我放在D盘里了:

2、配置Flutter SDK环境:windows搜索【查看高级系统设置】--->【环境变量】--->【系统变量】--->【path】路径配置到flutter文件夹下的bin目录

3、【windows+R】打开黑窗口,通过flutter --version查看是否安装成功。

4、在中国使用 Flutter需要配置Flutter镜像站点:windows搜索【查看高级系统设置】--->【环境变量】--->【系统变量】--->新建环境



5、【windows+R】打开黑窗口,运行flutter doctor命令检测环境是否配置成功。第一次执行此命令可能会出现以下情况:

【问题一】:Unable to locate Android SDK-无法找到Android SDK,因此我们需要去配置

(1)打开Android Studio,找到SDK Manager:

(2)找到Android SDK,勾选一下内容:

勾选完之后,点击确定。

(3)在Android SDK文件夹下找到platform-tools和tools两个文件路径,windows搜索【查看高级系统设置】--->【环境变量】--->【用户变量】--->【path】添加两个路径的配置。


(4)之后再执行flutter doctor会出现下面的警告,不要慌,我们根据警告提示,执行flutter doctor --android-licenses ,执行时会弹出(y/N)的选项,一直输入y就行。


(5)此时再执行flutter doctor会发现,Android SDK的问题就解决了。

【问题一】:Visual Studio not installed-Windows应用程序未安装Visual Studio,这对于开发windows应用程序是必要的。(如果只开发app的话,完全可以不用安装Visual Studio,但是如果需要进行桌面应用开发,就需要安装Visual Studio了)

(1)下载Visual Studio:下载Visual Studio,我安装的是社区版。

(2)安装成功之后会进入到这个页面,勾选这两个选项(安装之前,请确认你要安装的路径,如果C盘内存不够,请慎重!):

(3)点击安装(这个过程真的巨慢~~~)

(4)安装成功之后,再执行flutter doctor,就没问题啦!

在Android Studio中创建并运行Flutter项目

1、打开Android Studio,点击New Flutter Project--->Flutter--->确认Flutter SDK路径

(2)根据你的需求进行项目创建

(3)项目创建成功之后,在终端执行flutter run来运行。


(4)也可以连接安卓手机,进行真机调试:设备上启用 开发人员选项USB调试,用数据线连接电脑和安卓手机;在终端,运行 flutter devices 命令以验证Flutter识别您连接的Android设备;执行flutter run来运行程序。

相关推荐
小a杰.9 小时前
Flutter国际化(i18n)实现详解
flutter
前端西瓜哥9 小时前
平面几何:如何绘制一个星形?
前端
天天扭码9 小时前
解放双手!使用Cursor+Figma MCP 高效还原响应式设计稿
前端·mcp
嗝o゚9 小时前
开源鸿蒙 Flutter 应用包瘦身实战
flutter·华为·开源·harmonyos
今天不要写bug9 小时前
基于qrcode前端实现链接转二维码的生成与下载
前端·javascript·typescript·vue
小a杰.10 小时前
Flutter 响应式设计基础
flutter
惟恋惜10 小时前
Jetpack Compose 界面元素状态(UI Element State)详解
android·ui·android jetpack
JIngJaneIL10 小时前
基于Java + vue干洗店预约洗衣系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot
搬山境KL攻城狮10 小时前
记-SPA单页面应用Chrome自动翻译导致中文错别字问题
前端·chrome
HIT_Weston10 小时前
61、【Ubuntu】【Gitlab】拉出内网 Web 服务:Gitlab 配置审视(五)
前端·ubuntu·gitlab