Flutter 从入门到精通(水)

603 阅读2分钟

第1章:Flutter 简介与开发环境搭建

一、什么是 Flutter 和 Dart?

Flutter 是 Google 开源的一套跨平台 UI 框架,使用 Dart 编程语言开发。它允许开发者通过一套代码构建适用于 Android、iOS、Web、Windows、macOS 和 Linux 的原生应用。

✅ Flutter 的特点:

  • 跨平台:一次编写,多平台运行。
  • 高性能:使用 Skia 引擎渲染,接近原生性能。
  • 高开发效率:支持热重载,快速调试 UI。
  • 丰富的组件:内置大量 Material 和 Cupertino 风格组件。

💡 什么是 Dart?

Dart 是 Google 推出的编程语言,特点包括:

  • 类 JavaScript + Java 的语法
  • 支持 AOT(预编译)和 JIT(即时编译)
  • 良好的异步支持(Future、async/await)

二、Flutter 的应用场景与优势

适用场景:

  • 中小型跨平台项目(ToB/ToC 应用)
  • 快速迭代的 MVP 原型
  • 需要一致 UI 和用户体验的产品

不适用场景:

  • 深度依赖特定平台能力的应用(如原生视频编解码、蓝牙复杂操作)
  • 对包体积极为敏感的产品

三、开发环境安装

1. 安装 Flutter SDK

macOS:
brew install --cask flutter

或手动下载:

解压后设置环境变量(以 zsh 为例):

export PATH="$PATH:/path_to_flutter/bin"
Windows:
  • 下载 Flutter 安装包并解压
  • flutter/bin 添加到系统环境变量 PATH
  • 安装 Git(Flutter 依赖)
Linux:
  • 安装依赖项:

    sudo apt update
    sudo apt install git curl unzip xz-utils zip libglu1-mesa
    
  • 解压 Flutter 安装包并配置 PATH


2. 安装 Android Studio / VS Code

Android Studio:
VS Code(推荐轻量开发):
  • 安装 Dart、Flutter 插件
  • 安装 Android Studio(仅用于设备模拟器与 SDK 支持)

四、第一个 Flutter 应用(Hello World)

flutter create hello_flutter
cd hello_flutter
flutter run

默认生成的应用已经包含了计数器 Demo,运行后可看到一个简单的按钮加法界面。


五、常见问题排查

1. flutter doctor 提示错误

flutter doctor

常见错误:

  • Android licenses not accepted

    flutter doctor --android-licenses
    
  • 缺少命令行工具或 Java 环境:

    • 确保安装 Android Studio 并配置 JAVA_HOME

2. Android 模拟器无法启动

  • 确保已安装 Intel HAXM / ARM 仿真支持
  • 尝试使用 flutter emulators 命令查看可用模拟器
  • 检查是否启用了 CPU 虚拟化(BIOS 中开启 VT-x)

3. VS Code 无法识别 flutter 命令

  • 确保 VS Code 的终端中 flutter --version 可用
  • 检查系统环境变量 PATH 是否正确配置
  • 有时需重启 VS Code 或电脑使配置生效