当前位置：首页 > news >正文

【Flutter】基础入门：开发环境搭建

news 2025/7/22 12:39:57

Flutter 是一个强大的跨平台框架，支持在 Android、iOS、Windows、Linux、Web 等多种平台上开发应用。下面将详细介绍如何在各个平台上构建 Flutter 开发环境，并使用相同的项目代码构建出一个可以在多个平台运行的跨平台 Demo。

Flutter 环境配置：Windows、Linux、Android、iOS、Web

通用步骤：安装 Flutter SDK

在不同的操作系统上，首先需要安装 Flutter SDK，这里详细讲解了在 Windows 和 Linux 上安装的步骤。

步骤 1：安装 Flutter SDK

访问 Flutter 官方网站下载适合操作系统的 Flutter SDK。
解压下载的 SDK 到合适的路径。例如：
- Windows：C:\src\flutter
- Linux：/opt/flutter
将 flutter/bin 目录添加到系统的 PATH 环境变量中：
- Windows：在系统环境变量中编辑 PATH。
- Linux：在 ~/.bashrc 或 ~/.zshrc 中添加 export PATH="$PATH:/opt/flutter/bin"。

步骤 2：运行 Flutter Doctor

打开终端或命令行窗口，运行以下命令，检查是否缺少任何依赖：

flutter doctor

flutter doctor 会检查你的开发环境，并报告任何缺少的依赖，例如 Android SDK、iOS 依赖等。

Windows 环境配置

步骤 3：安装 Android Studio 和 Android SDK

Flutter 需要 Android SDK 来构建 Android 应用。在 Windows 系统中，使用 Android Studio 来管理 Android SDK。

安装 Android Studio。
打开 Android Studio，配置 Android SDK，并下载最新的 Android SDK 工具。
在 Android Studio 中启用 Flutter 和 Dart 插件。

步骤 4：安装 Visual Studio（可选，用于 Windows 桌面开发）

如果你计划在 Windows 桌面上开发 Flutter 应用，需要安装 Visual Studio，并启用“桌面开发”工作负载。
安装 Visual Studio 2022，选择“桌面开发”工作负载。

Linux 环境配置

步骤 3：安装 Android Studio 和 Android SDK

与 Windows 环境相同，Linux 也需要 Android Studio 进行 Android 应用开发。

安装 Android Studio 并配置 Android SDK。

步骤 4：Linux 桌面开发（可选）

安装开发工具：

sudo apt-get install clang cmake ninja-build pkg-config libgtk-3-dev

iOS 环境配置

步骤 3：安装 Xcode

在 macOS 上进行 iOS 开发，需要安装 Xcode。

从 Mac App Store 安装 Xcode。
打开 Xcode，安装必要的工具并接受 Xcode 许可协议：
```
sudo xcodebuild -license
```

步骤 4：安装 CocoaPods

Flutter 需要使用 CocoaPods 来管理 iOS 依赖。

sudo gem install cocoapods

Web 环境配置

步骤 3：启用 Flutter Web 支持

在 Flutter 中，默认支持 Web 开发。在安装 Flutter SDK 后，运行以下命令启用 Web 支持：

flutter config --enable-web

步骤 4：安装 Chrome 浏览器

Flutter Web 使用 Chrome 作为默认浏览器进行调试，因此需要安装 Google Chrome。

通用步骤：验证环境配置

运行以下命令，确保 Flutter SDK 配置正确，并安装了相应平台的支持工具：

flutter doctor

确保所有依赖都已安装完毕，尤其是 Android、iOS（仅限 macOS）、Web、桌面等平台的支持。

创建跨平台 Flutter Demo 项目

现在你已经安装了 Flutter 环境，我们可以创建一个简单的跨平台项目，并部署到各个平台上。

步骤 1：创建 Flutter 项目

打开终端或命令行窗口，使用 flutter create 命令创建一个新的 Flutter 项目：

flutter create cross_platform_demo

进入项目目录：

cd cross_platform_demo

步骤 2：编写跨平台代码

打开 lib/main.dart，这是 Flutter 应用的入口文件。我们将编写一个简单的 Flutter 应用，它在多个平台上都可以运行。

import 'package:flutter/material.dart';void main() {runApp(const MyApp());
}class MyApp extends StatelessWidget {const MyApp({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(title: 'Cross Platform Demo',theme: ThemeData(primarySwatch: Colors.blue,),home: const MyHomePage(),);}
}class MyHomePage extends StatelessWidget {const MyHomePage({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text('Cross Platform Demo'),),body: Center(child: Column(mainAxisAlignment: MainAxisAlignment.center,children: const <Widget>[Text('This is a cross-platform app!',style: TextStyle(fontSize: 20),),SizedBox(height: 20),Icon(Icons.flutter_dash, size: 100),],),),);}
}