1. D盘下 新建文件夹 (D:\flutter_work)
  2. cmd进入flutter_work

image.png

  1. 在终端输入 flutter create flutter_name(项目名称) 一路到底执行—如下图表示创建成功

20210323174629.png

  1. 最终创建后的目录

image.png

  1. 用 Android Studio打开,或者用VScode 打开项目,建议用VScode

VScode打开:
image.png

  1. flutter run

错误1:
No supported devices connected.

原因是flutter没有找到连接的设备或者模拟器,定位此问题的一些步骤。
分为两种情况:连接的是真机和连接的是模拟器。

配置连接android真机

  1. 首先确保android的真机版本为Android 4.1 (API level 16)或以上
  2. 在android机上把开发者选项以及usb 调试(debug)打开
  3. 使用USB线把手机连接到电脑时,需要授权电脑可以访问android机
  4. 执行flutter devices命令,检查Flutter是否能识别出android机
  5. 如果一切正常,那么就可以执行flutter run了。

    配置连接android模拟器

  6. 在电脑上打开VM acceleration

  7. 按Android Studio>Tools>Android>AVD Manager,添加android模拟器,虚拟设备
  8. 配置虚拟机,推荐选择x86和x86_64的image
  9. 在Emulated Performanc选项上,选择Hardware - GLES 2.0,用来开启硬件加速
  10. 启动模拟机,接着就可以执行 flutter run了。

错误2:
image.png

  1. Using hardware rendering with device sdk gphone x86 arm. If you notice graphics artifacts, consider enabling software rendering with "--enable-software-rendering".
  2. Launching lib\main.dart on sdk gphone x86 arm in debug mode...
  3. Running Gradle task 'assembleDebug'...

解决办法

  1. 第一步:修改build.gradle,注释掉jcenter(),google()。使用阿里的镜像。原因是jcenter google库无法访问到导致的问题。虽然我有万能的爬墙工具,开启全局代理依然被我们伟大的发改委墙掉了!
  2. buildscript {
  3. repositories {
  4. //google()
  5. //jcenter()
  6. maven { url 'https://maven.aliyun.com/repository/google' }
  7. maven { url 'https://maven.aliyun.com/repository/jcenter' }
  8. maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
  9. }
  10. dependencies {
  11. classpath 'com.android.tools.build:gradle:3.2.1'
  12. }
  13. }
  14. allprojects {
  15. repositories {
  16. //google()
  17. //jcenter()
  18. maven { url 'https://maven.aliyun.com/repository/google' }
  19. maven { url 'https://maven.aliyun.com/repository/jcenter' }
  20. maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
  21. }
  22. }
  23. 第二步:修改flutter.gradle 文件路径为:flutter>packages>flutter_tools>gradle>flutter.gradle
  24. buildscript {
  25. repositories {
  26. //google()
  27. //jcenter()
  28. maven { url 'https://maven.aliyun.com/repository/google' }
  29. maven { url 'https://maven.aliyun.com/repository/jcenter' }
  30. maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
  31. }
  32. dependencies {
  33. classpath 'com.android.tools.build:gradle:3.2.1'
  34. }
  35. }

备注:
编辑更新命令

  1. r Hot reload.
  2. R Hot restart.
  3. h Repeat this help message.
  4. d Detach (terminate "flutter run" but leave application running).
  5. c Clear the screen
  6. q Quit (terminate the application on the device).
  7. An Observatory debugger and profiler on sdk gphone x86 arm is available at: http://127.0.0.1:59330/LSl91zYYw3M=/

运行成功的结果:
image.png

授权许可

出现以下错误 需要执行 flutter doctor —android-licenses
image.png

  1. [√] Flutter (Channel stable, 1.22.6, on Microsoft Windows [Version 10.0.19041.867], locale zh-CN)
  2. [!] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
  3. ! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
  4. [!] Android Studio (version 3.5)
  5. X Flutter plugin not installed; this adds Flutter specific functionality.
  6. X Dart plugin not installed; this adds Dart specific functionality.
  7. X Unable to find bundled Java version.
  8. [!] Android Studio (version 4.1.0)
  9. X Flutter plugin not installed; this adds Flutter specific functionality.
  10. X Dart plugin not installed; this adds Dart specific functionality.
  11. [√] VS Code (version 1.54.3)
  12. [√] Connected device (1 available)
  13. ! Doctor found issues in 3 categories.

执行授权结果(表示授权成功)
image.png

Android Studio flutter配置

下载并安装 Android Studio.

启动Android Studio,然后执行“Android Studio安装向导”。这将安装最新的Android SDK,Android SDK平台工具和Android SDK构建工具,这是Flutter为Android开发时所必需的

  1. 3. android studio 安装 flutter dart插件

File->Settings->Plugins-> Browse repositories…

搜索框输入flutter,点击 install 进行安装(会同时安装dart插件)

image.png

体验Flutter


image.png


image.png


image.png


image.png

  1. run

image.png