前面多文介紹了Dart編程語言的基本語法和語言特性。從本文開始，我們通過一個Flutter App的編碼過程，完成Flutter的學習，包括Flutter基礎知識，Flutter App啟動頁，Tab頁，個人設置頁，SQLite資料庫，HTTP API調用，到最後Flutter App打包等…… ...
Flutter安裝文檔：
Dart升級
- Dart安裝參考前面文章（Dart安裝和初體驗）：https://ntopic.cn/p/2023092301
- 後續學習我們採用最新Flutter版本，因此建議升級Dart最新版本（當前：3.2.0）：
brew upgrade dart
$ brew info dart
==> dart-lang/dart/dart: stable 3.2.0, HEAD
SDK
https://dart.dev
Conflicts with:
dart-beta (because dart-beta ships the same binaries)
/usr/local/Cellar/dart/3.2.0 (1,022 files, 560.8MB) *
Built from source on 2023-11-19 at 10:04:05
From: https://github.com/dart-lang/homebrew-dart/blob/HEAD/Formula/dart.rb
==> Options
--HEAD
Install HEAD version
==> Caveats
Please note the path to the Dart SDK:
/usr/local/opt/dart/libexec
VS Code安裝
VS Code是免費的，支持Flutter的研發、調試和運行，沒有理由不使用它作為Flutter的研發IDE（IntelliJ IDEA非常強大，可惜是收費）。
下載和安裝VS Code下載：
- 首先通過官網下載VS Code：https://code.visualstudio.com/docs/?dv=win
- 點擊下載之後，發現下載速度很慢：右鍵複製下載鏈接，然後把功能變數名稱換成 “vscode.cdn.azure.cn”，重新通過瀏覽器打開進行下載，速度杠杠的
VS Code安裝成功之後，就進行Flutter安裝和配置。
Flutter SDK安裝
我們可以從GitHub原始倉庫和Gitee鏡像倉庫下載，由於中國訪問GitHub網速太慢，建議從Gitee鏡像倉庫下載：
# 源代碼目錄 [/Users/obullxl/FlutterSpace]
$ cd /Users/obullxl/FlutterSpace
# Gitee下載 [推薦方式]
$ git clone -b stable https://gitee.com/mirrors/Flutter.git flutter
# GitHub下載 [網速可能較慢]
$ git clone -b stable https://github.com/flutter/flutter.git flutter
Flutter SDK有多個版本，如beta、master、stable等，其中beta/master為開發分支，stable為穩定分支，建議使用穩定分支：
- 查看所有分支：
flutter channel - 切換本地分支：
flutter channel xxx - 查看當前版本：
flutter --version - 升級最新版本：
flutter upgrade - 檢測Flutter配置：
flutter doctor
# 切換到Flutter源代碼目錄
$ cd /Users/obullxl/FlutterSpace/flutter
# 查看Flutter所有分支 [建議stable分支]
$ flutter channel
Flutter channels:
master
main
beta
* stable
# 切換到stable分支
$ flutter channel stable
# 查看當前版本，由於我的Flutter是之前安裝的版本[3.7.1]
$ flutter --version
Flutter 3.7.1 • channel stable • https://gitee.com/mirrors/Flutter.git
Framework • revision 7048ed95a5 (10 months ago) • 2023-02-01 09:07:31 -0800
Engine • revision 800594f1f4
Tools • Dart 2.19.1 • DevTools 2.20.1
# 升級Flutter版本
$ flutter upgrade
# 再次查看Flutter版本，已經是最終版本[3.16.0]
$ flutter --version
Flutter 3.16.0 • channel stable • https://gitee.com/mirrors/Flutter.git
Framework • revision db7ef5bf9f (3 days ago) • 2023-11-15 11:25:44 -0800
Engine • revision 74d16627b9
Tools • Dart 3.2.0 • DevTools 2.28.2
# 檢測Flutter配置情況
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[!] Flutter (Channel stable, 3.16.0, on macOS 12.6.7 21G651 darwin-x64, locale zh-Hans-CN)
! Warning: `dart` on your path resolves to
/usr/local/Cellar/dart/3.1.2/libexec/bin/dart, which is not inside your current
Flutter SDK checkout at /Users/obullxl/FlutterSpace/flutter. Consider adding
/Users/obullxl/FlutterSpace/flutter/bin to the front of your path.
[!] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
✗ cmdline-tools component is missing
Run `path/to/sdkmanager --install "cmdline-tools;latest"`
See https://developer.android.com/studio/command-line for more details.
✗ Android license status unknown.
Run `flutter doctor --android-licenses` to accept the SDK licenses.
See https://flutter.dev/docs/get-started/install/macos#android-setup for more
details.
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] IntelliJ IDEA Ultimate Edition (version 2021.1.3)
[✓] VS Code (version 1.84.0)
[✓] Connected device (2 available)
[✓] Network resources
! Doctor found issues in 2 categories.
Flutter 倉庫配置
和Java編程需要配置Maven國內倉庫一樣，Flutter也需要配置國內倉庫，否則訪問國外倉庫要麼訪問不了，要麼網速太慢。
在環境變數中，增加如下配置：
# 建軟連接 [便於後面統一管理]
$ cd /opt
$ sudo ln -s /Users/obullxl/FlutterSpace/flutter ./flutter
# 系統變數
$ sudo vi /etc/profile
# 增加內容
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export FLUTTER_GIT_URL=https://gitee.com/mirrors/Flutter.git
export PATH=$PATH:/opt/flutter/bin
# 生效環境變數
$ source /etc/profile
最後
至此，Flutter安裝和配置已經完成了，接下來我們就通過VS Code編寫Flutter App了！
我的本博客原地址：https://ntopic.cn/p/2023112001
本文作者：奔跑的蝸牛，轉載請註明原文鏈接：https://ntopic.cn
