Flutter 项目快速入门指南

今日無事
293 阅读5分钟

1 准备工作

2 创建第一个 Flutter 项目

当第一次打开 Android Studio 时，它通常会下载一些必要的 Android SDK 组件和工具，包括：

  • Android Emulator：Android 设备模拟器，用于在计算机上测试和运行 Android 应用程序。
  • Android SDK Build-Tools 35：用于构建、编译和打包 Android 应用程序的工具集。
  • Android SDK Platform 35：Android 平台的核心组件，包括 Android 操作系统的 API、类库和系统图像。
  • Android SDK Platform-Tools：用于与 Android 设备通信、调试和管理应用程序的工具集。
  • Sources for Android 35：包含 Android 框架的源代码，供开发人员查看和理解 Android 框架的实现细节。

为了在 Android Studio 中开发 Flutter 应用程序需要安装 Flutter 插件，安装流程如下：

  1. 打开 Android Studio：首先打开 Android Studio 开发环境。

  2. 打开插件市场：在 Android Studio 中，点击菜单栏的 "File" -> "Settings/Preferences"，然后选择 "Plugins"。

  3. 安装插件：在插件市场搜索框中输入 "Flutter"，找到 Flutter 插件并点击 "Install" 安装。

  4. 安装完成：安装完成后，重启 Android Studio 生效。

新建 Flutter 项目

  1. 打开 Android Studio：首先打开 Android Studio 开发环境。

  2. 打开插件市场：在 Android Studio 中，点击菜单栏的 "File" -> "New" -> "New Flutter Project"，然后选择 "Flutter"。

  3. 配置 Flutter SDK 路径：在 Flutter SDK path 中导入下载到本地的 Flutter SDK 文件。

  4. 填写项目信息：输入项目名称、描述和存储位置，然后点击 "Create"。

指定新的 Flutter SDK 版本

3 环境配置

配置环境变量是为了让系统知道在哪里可以找到安装的 JDK、Android SDK 和 Flutter SDK 等工具，以便在命令行或开发工具中能够正确地调用这些工具。通过配置环境变量，你可以在任何位置运行相关命令，而不需要手动指定这些工具的路径。

3.1 配置环境变量

Windows

  1. 右键点击 "此电脑" -> "属性" -> "高级系统设置" -> "环境变量"。 
  2. 在系统变量中，找到 "Path" 变量，点击 "编辑"。 
  3. 在弹出的窗口中，点击 "新建"，然后输入 JDK、Android SDK 和 Flutter SDK 的路径，多个路径之间用分号分隔。 
  4. 确认保存所有更改。 

MacOS

  1. 确认默认 shell：macOS Catalina 之前默认使用的是 Bash shell，Catalina 及之后版本默认使用的是 Zsh shell。
  2. 打开终端，编辑或创建一个名为 .bash_profile 或 .zshrc 的文件，可以使用编辑器如 nano 或 vim。 
  • 如果是 Bash shell，可以在 ~/.bash_profile 或 ~/.bashrc 文件中配置环境变量。 
  • 如果是 Zsh shell，可以在 ~/.zshrc 文件中配置环境变量。

  1. 添加以下内容：

    # Java环境
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-17.jdk/Contents/Home
export PATH=$PATH:$JAVA_HOME/bin
export CLASS_PATH=$JAVA_HOME/lib

# Android环境
export ANDROID_HOME=/Users/edy/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/platform-tools
export PATH=$PATH:$ANDROID_HOME/build-tools
export PATH=$PATH:$ANDROID_HOME/tools

# Flutter环境
export FLUTTER_ROOT=/Users/edy/flutter\ sdk/stable/flutter
export PATH=$PATH:$FLUTTER_ROOT/bin

# Flutter国内镜像
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export FLUTTER_GIT_URL=git@github.com:flutter/flutter.git

# Gradle环境
export GRADLE_HOME=/opt/homebrew/bin/gradle
export PATH=$PATH:$GRADLE_HOME/bin

  2. 保存文件并执行 source ~/.bash_profile 或 source ~/.zshrc 使更改生效。

3.2 检查 Flutter 开发环境设置 

检查 Flutter 开发环境设置命令是 flutter doctor ，当第一次运行 flutter doctor 命令时，将会下载一些必要的资源和工具来进行环境检查和配置。

1. Unable to find bundled Java version.

安装 JDK 步骤如下：

  1. 安装 JDK

  2. 设置 JAVA_HOME 环境变量

  3. 重新启动终端或计算机

    edy@edydeMacBook-Air ~ % java -versionjava version "17.0.12" 2024-07-16 LTSJava(TM) SE Runtime Environment (build 17.0.12+8-LTS-286)Java HotSpot(TM) 64-Bit Server VM (build 17.0.12+8-LTS-286, mixed mode, sharing)

2. Flutter Channel unknown & Unknown upstream repository

这是因为 Flutter 无法识别或确定当前所使用的Flutter通道（channel），每个通道都具有不同的特性和稳定性级别。

  1. 查看当前Flutter渠道

    flutter channel

  2. 切换到稳定版官方渠道

    flutter channel stable

  3. 升级Flutter到最新版本（可选）

    flutter upgrade

3. cmdline-tools component is missing & Android license status unknown.

  1. 在 Android Studio 设置中选中 Android SDK，选择 SDK Tools 并下载Android SDK Command-line Tools
  2. flutter doctor --android-licenses
  3. 在终端中输入 y，接受所有相关 android-licenses

4 常见问题和解决方案

1. Running Gradle task 'assembleDebug'...Exception in thread "main" java.util.zip.ZipException: zip END

Launching lib/main.dart on sdk gphone64 arm64 in debug mode...Running Gradle task 'assembleDebug'...Exception in thread "main" java.util.zip.ZipException: zip END header not found at java.base/java.util.zip.ZipFileSource.findEND(UnknownSource)atjava.base/java.util.zip.ZipFileSource.findEND(Unknown Source) at java.base/java.util.zip.ZipFileSource.initCEN(Unknown Source) at java.base/java.util.zip.ZipFileSource.<init>(UnknownSource)atjava.base/java.util.zip.ZipFileSource.<init>(Unknown Source) at java.base/java.util.zip.ZipFileSource.get(Unknown Source) at java.base/java.util.zip.ZipFileCleanableResource.<init>(UnknownSource)atjava.base/java.util.zip.ZipFile.<init>(UnknownSource)atjava.base/java.util.zip.ZipFile.<init>(UnknownSource)atjava.base/java.util.zip.ZipFile.<init>(UnknownSource)atorg.gradle.wrapper.Install.unzip(Install.java:214)atorg.gradle.wrapper.Install.accessCleanableResource.<init>(Unknown Source) at java.base/java.util.zip.ZipFile.<init>(Unknown Source) at java.base/java.util.zip.ZipFile.<init>(Unknown Source) at java.base/java.util.zip.ZipFile.<init>(Unknown Source) at org.gradle.wrapper.Install.unzip(Install.java:214) at org.gradle.wrapper.Install.access600(Install.java:27) at org.gradle.wrapper.Install1.call(Install.java:74)atorg.gradle.wrapper.Install1.call(Install.java:74) at org.gradle.wrapper.Install1.call(Install.java:48) at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:65) at org.gradle.wrapper.Install.createDist(Install.java:48) at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:128) at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:61)Error: Gradle task assembleDebug failed with exit code 1

这个错误信息表明在运行 Gradle 任务 'assembleDebug' 时出现了问题，具体是由于 Java 在解压缩时找不到 zip 文件的 END 头部导致的。这可能是由于 Gradle Wrapper 下载的 Gradle 压缩包文件损坏或不完整导致的。

  • Gradle Wrapper 是 Gradle 官方提供的一个工具，用于帮助项目在没有预先安装 Gradle 的情况下运行。当你使用 Gradle Wrapper 时，项目会包含一个名为 gradlew 或 gradlew.bat 的脚本文件，以及一个名为 gradle/wrapper 的文件夹，其中包含了 Gradle Wrapper 所需的配置文件和 Gradle 版本的压缩包。
  • Gradle Wrapper 的作用就是在项目中管理 Gradle 版本，它会自动下载和使用指定版本的 Gradle，无需手动安装 Gradle。
  • /Users/edy/.gradle/wrapper/dists/gradle-7.6.3-all 这个目录中存储的是 Gradle 的 Wrapper 文件。

解决步骤：

  1. 删除 Gradle 缓存：
    运行 flutter clean 命令清除 Flutter 项目的构建缓存。

  2. 重新下载 Gradle Wrapper：
    删除 /Users/edy/.gradle/wrapper/dists/gradle-7.6.3-all Gradle 压缩包文件，然后重新运行 Gradle 任务，Gradle Wrapper 会尝试重新下载并解压 Gradle 文件。

2. 如何运行 Gradle 任务

  • 使用 Gradle Wrapper

  • 在终端中进入到 Flutter 项目目录，然后运行 ./gradlew <task_name>  命令来执行任务。

  • 使用本地安装的 Gradle 

  • 在本地安装 Gradle，并将其添加到系统路径中，运行 gradle <task_name> 命令来执行任务。

其中 <task_name> 是你要运行的 Gradle 任务的名称，比如 assembleDebug。这将使用 Gradle Wrapper 来运行指定的任务。在 Flutter 项目中，通常会使用 Gradle Wrapper 来管理 Gradle 版本和构建项目。

Gradle Wrapper 相关命令

  • ./gradlew build：构建项目，编译项目的源代码并生成可执行文件。

  • ./gradlew clean：清理项目，删除构建过程中生成的临时文件和输出文件。

  • ./gradlew tasks：列出项目中可用的所有任务，包括构建任务、测试任务等。

  • ./gradlew assemble：将项目的构建结果打包成可分发的格式，例如 JAR、APK 等。

  • ./gradlew test：运行项目中的测试。

  • ./gradlew dependencies：显示项目的依赖关系。

  • ./gradlew help：获取关于 Gradle Wrapper 的帮助信息。

3. 如何查看 Flutter 相关设置

项目中搜不到 flutter.compileSdkVersion  相关信息，可打开文件 /flutter/packages/flutter_tools/gradle/src/main/groovy/flutter.groovy，此文件配置 flutter 设置，或者在 build.gradle 文件中直接修改。

avatar
文章
阅读
粉丝