依次选择对应的平台 windows macos ios之类的
开发工具很多 推荐 VSCode
安装插件
- Flutter
- dart
根据 VS Code 的提示,安装 Flutter
-
启动 VS Code。
-
打开 命令面板 (Command Palette) ,按下快捷键
Command+Shift+P。 -
在 命令面板 (Command Palette) 中输入
flutter。 -
选择 Flutter: New Project。
-
VS Code 会提示你在计算机上找到 Flutter SDK。
-
如果你已经安装 Flutter SDK,请单击 Locate SDK。
-
如果你没有安装 Flutter SDK, 请单击 Download SDK。
如果你没有按照 开发工具的必要条件 安装 Git ,单击该按钮后会导航至 Flutter 安装页面。
-
-
当提示 Which Flutter template? 的时候,请忽略它。可以按下
Esc。你可以在检查完开发配置后创建初始测试项目。
下载 Flutter SDK
-
当对话框 Select Folder for Flutter SDK 显示时,选择你想要安装 Flutter 的位置。
VS Code 会打开你默认的位置。你可以选择其他位置。
请考虑
~/development/这样的位置 -
单击 Clone Flutter。
在下载 Flutter 时,VS Code 会弹出该通知:
Downloading the Flutter SDK. This may take a few minutes.content_copy
下载需要一些时间。如果你怀疑下载被挂起,请单击 Cancel 取消下载后,再重新尝试安装。
-
Flutter 一旦完成下载, 输出 (Output) 面板就会显示。
Checking Dart SDK version... Downloading Dart SDK from the Flutter engine ... Expanding downloaded archive...content_copy
成功后,VS Code 会弹出该通知:
Initializing the Flutter SDK. This may take a few minutes.content_copy
初始化时,输出 (Output) 面板会显示下面的内容:
Building flutter tool... Running pub upgrade... Resolving dependencies... Got dependencies. Downloading Material fonts... Downloading Gradle Wrapper... Downloading package sky_engine... Downloading flutter_patched_sdk tools... Downloading flutter_patched_sdk_product tools... Downloading windows-x64 tools... Downloading windows-x64/font-subset tools...content_copy
该进程还会运行
flutter doctor -v。此时,请忽略该输出。因为 Flutter Doctor 可能会显示与本次快速启动无关的错误。Flutter 安装成功后,VS Code 会弹出该通知:
Do you want to add the Flutter SDK to PATH so it's accessible in external terminals?content_copy
-
VS Code 可能会显示一则 Google Analytics 的通知。
如果你同意,请单击 OK。
-
在所有 Terminal 窗口中启用
flutter:- 关闭,然后重新打开所有 Terminal 窗口。
- 重新启动 VS Code。
配置 iOS 开发
安装并配置 Xcode
要为 iOS 开发 Flutter 应用,请安装 Xcode,以便编译为原生字节码。
-
打开 App Store 并登录。
-
搜索
Xcode。 -
点击 获取 (Install) 。
Xcode 安装程序占用 6 GB 以上的存储空间。下载可能需要一些时间。
-
请运行以下命令,来配置命令行工具使用已安装的 Xcode 版本。
sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'content_copy
使用以上路径可以获取最新版本的 Xcode。如果你需要使用其他版本,请自行指定该路径。
-
签署 Xcode 许可证协议。
sudo xcodebuild -licensecontent_copy
请尽量使用最新版本的 Xcode。
选择模拟器
随便写点代码 lib/main.dart
import 'package:flutter/material.dart';
void main() {
runApp(const TabBarDemo());
}
class TabBarDemo extends StatelessWidget {
const TabBarDemo({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: DefaultTabController(
length: 3,
child: Scaffold(
appBar: AppBar(
bottom: const TabBar(
tabs: [
Tab(icon: Icon(Icons.directions_car)),
Tab(icon: Icon(Icons.directions_transit)),
Tab(icon: Icon(Icons.directions_bike)),
],
),
title: const Text('Tabs Demo'),
),
body: const TabBarView(
children: [
Icon(Icons.directions_car),
Icon(Icons.directions_transit),
Icon(Icons.directions_bike),
],
),
),
),
);
}
}