当前位置:   article > 正文

Android Flutter开发环境搭建

android flutter

1、搭建 Flutter 开发环境

本栏亦在快速上手Android Flutter,Flutter框架就不介绍了,框架这个东西怎么说呢,对于大部分人来说只是了解即可,如需了解的话,可以度娘资料很多。
本节我们主要看下如何在Windwos下搭建Android Flutter开发环境,然后了解下IDE上面的Flutter开发。

1.1 系统要求

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

操作系统: Windows 7 或更高版本 (64-bit)。

磁盘空间: 400 MB (不包括Android Studio的磁盘空间)。

工具: Flutter 依赖下面这些命令行工具。

Git for Windows (opens new window) (Git命令行工具);

如果已安装Git for Windows,请确保可以在命令提示符或PowerShell中运行 git 命令。

1.2安装准备

1.2.1 使用镜像

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

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

注意: 如该镜像不可用,可以参考https://flutter.dev/community/china 以获得有关镜像服务器的最新动态。

1.2.2 下载cmdline-tools

Android SDK Manager中SDK Tools勾选Android SDK Command-line Tools 安装即可。

在这里插入图片描述

1.3 获取Flutter SDK

  1. 去flutter官网下载其最新可用的安装包,下载地址:https://flutter.dev/docs/development/tools/sdk/releases 。
    如果上面链接无法打开,可以去Flutter github项目下去下载安装包,地址:https://github.com/flutter/flutter/releases 。

  2. 下载的安装包解压到对应目录即可,尽量不解压到权限较高的目录比如:C:\Program Files\。

  3. 在Flutter安装目录下找到flutter_console.bat,双击运行并启动,接下来,你就可以在命令行运行flutter命令了。
    或者在系统环境变量Path中添加安装目录\flutter\bin,笔者建议直接添加系统环境变量,毕竟后面使用方便。

  4. 配置Android sdk 目录

    flutter config --android-sdk /path/to/android/sdk
  • 1

      其中 /path/to/android/sdk 是你自己的sdk路径,如我的是 D:Android\Sdk

  1. flutter doctor命令
    在Flutter命令行运行如下命令来查看是否还需要安装其他依赖,如果需要,安装它们:
    flutter doctor
  • 1

      该命令检查你的环境并在命令行窗口中显示报告。Dart SDK已经在打包在Flutter SDK里了,没有必要单独安装Dart。 仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务。

例如:

   [-] Android toolchain - develop for Android devices
       • Android SDK at D:\Android\sdk
       ✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
       • Try re-installing or updating your Android SDK,
         visit https://flutter.dev/setup/#android-setup for detailed instructions.
  • 1
  • 2
  • 3
  • 4
  • 5

这里就是command line未安装,可按照上面给出的方式安装,然后再次执行flutter doctor再次查看是否还有异常。

  1. 安装Android license
    flutter doctor --android-licenses
  • 1

      第一次安装需要执行安装Android license,执行后按照提示输入y即可。

1.4 升级 Flutter

1.4.1 Flutter SDK分支

Flutter SDK有多个分支,如beta、dev、master、stable,其中stable分支为稳定分支(日后有新的稳定版本发布后可能也会有新的稳定分支,如1.0.0),dev和master为开发分支,安装flutter后,你可以运行flutter channel查看所有分支,如我本地运行后,结果如下:

    Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
    Flutter channels:
    master
    main
    beta
    * stable
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

带"*"号的分支即你本地的Flutter SDK 跟踪的分支,要切换分支,可以使用flutter channel beta 或 flutter channel master,Flutter官方建议跟踪稳定分支,但你也可以跟踪master分支,这样可以查看最新的变化,但这样稳定性要低得多。

1.4.2 升级Flutter SDK和依赖包

升级flutter sdk,只需一句命令:

    flutter upgrade
  • 1

该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包(不包括Flutter SDK),可以使用如下命令:

    flutter packages get 获取项目所有的依赖包。
    flutter packages upgrade 获取项目所有依赖包的最新版本
  • 1
  • 2

1.5 IDE配置与使用

Flutter官方建议Android使用Android Studio以获得更好的开发体验,而且Android Studio也是Android 标配的开发工具。Flutter官方提供了两款编辑器插件,通过IDE和插件可获得代码补全、语法高亮、widget编辑辅助、运行和调试支持等功能,可以帮助我们极大地提高开发效率。
下面我们就介绍一下Android Studio上的使用(Android Studio下载安装这里就不再赘述)。

1.5.1 安装Flutter和Dart插件

需要安装两个插件:

 Flutter插件: 支持Flutter开发工作流 (运行、调试、热重载等)。
 Dart插件: 提供代码分析 (输入代码时进行验证、代码补全等)。
  • 1
  • 2

安装步骤:

启动Android Studio。
打开插件首选项 (File>Settings>Plugins)。
选择搜索Dart和Flutter并点击 install。
重启Android Studio后插件生效。

在这里插入图片描述
在这里插入图片描述

1.5.2 创建Flutter应用

选择 File>New Flutter Project 。
选择 Application 作为 project 类型。
输入项目名称 (如 fluttertest),项目名称必须全小写(真坑)。
输入包名,包名不需要带项目名称,会自动加上,这一点需要注意下。
点击Create。

在这里插入图片描述

等待Android Studio安装SDK并创建项目。
上述操作创建一个Flutter项目,项目名为fluttertest。

在项目目录中,您应用程序的UI代码位于 lib/main.dart。

1.5.3 运行应用程序

定位到Android Studio工具栏,如下图所示:

在这里插入图片描述

在 Flutter Device Selection中, 选择一个运行该应用的Android设备。我这里选择的是V2046A我的手机。有Android 开发经验的应该都懂,我这里罗嗦了。

在工具栏中点击 Run图标。

如果一切正常, 您应该在您的设备或模拟器上会看到启动的应用程序:
在这里插入图片描述

1.5.4 热重载

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

打开lib/main.dart文件

将字符串 ‘You have pushed the button this many times:’ 更改为 ‘You have click the button this many times:’

不要按“停止”按钮; 让您的应用继续运行.

要查更改,请调用 Save ( ctrl-s),或者点击 热重载按钮 (带有闪电⚡️图标的按钮)。

你会立即在运行的应用程序中看到更新的字符串。
在这里插入图片描述

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/知新_RL/article/detail/810133
推荐阅读
相关标签
  

闽ICP备14008679号