目錄
description bug_report

開始在 Windows 上建立 Flutter Android 應用

目錄

系統要求

在安裝和執行 Flutter 前，你的 Windows 環境必須滿足以下要求：

硬體要求

你的 Windows Flutter 開發環境必須滿足以下最低硬體要求。

要求 最低 推薦
x86_64 CPU 核心數 4 8
記憶體 (GB) 8 16
顯示器解析度（畫素） WXGA (1366 x 768) FHD (1920 x 1080)
可用磁碟空間 (GB) 10.0 10.0

軟體要求

要為 mobile 編寫和編譯 Flutter 程式碼，你必須安裝以下版本的 Windows 以及所列出的軟體套件。

作業系統

Flutter 支援 64-bit version of Microsoft Windows 10 或更高版本。這些版本的 Windows 必須包含 Windows PowerShell 5.0 或更高版本。

開發工具

下載並安裝以下軟體套件的 Windows 版本：

  • Git for Windows 2.27 或更高的版本來管理原始碼。

  • Android Studio 2023.1 (Hedgehog) 除錯和編譯 Android 的 Java 或 Kotlin 程式碼。 Flutter 需要完整版本的 Android Studio.

上述軟體的開發商為這些產品提供支援。如果需要排查安裝的問題，請查閱該產品的文件。

當你在當前版本執行 flutter doctor 的時候，它可能會列出這些軟體套件的其他不同版本。如果出現這種情況，請安裝它推薦的版本。

設定文字編輯器或 IDE

你可以使用任意文字編輯器或整合開發環境 (IDE)，並結合 Flutter 的指令行工具，來使用 Flutter 建立應用程式。

使用帶有 Flutter 擴充套件或外掛的 IDE 會提供程式碼自動補全、語法高亮、widget 編寫輔助、除錯以及其他功能。

以下是熱門的擴充套件外掛：

安裝 Flutter SDK

你可以使用 VS Code Flutter 擴充套件或自行下載安裝 Flutter 壓縮封裝，來安裝 Flutter SDK。

使用 VS Code 安裝 Flutter

在使用以下流程來安裝 Flutter 前，請確保你已經安裝 Visual Studio Code 1.77 或更高版本，以及 Flutter extension for VS Code。

根據 VS Code 的提示，安裝 Flutter

  1. 啟動 VS Code。

  2. 開啟 指令面板 (Command Palette)，按下快捷鍵 Control + Shift + P。

  3. 在 指令面板 (Command Palette) 中輸入 flutter。

  4. 選擇 Flutter: New Project。

  5. VS Code 會提示你在電腦上找到 Flutter SDK。

    1. 如果你已經安裝 Flutter SDK，請單擊 Locate SDK。

    2. 如果你沒有安裝 Flutter SDK, 請單擊 Download SDK。

      如果你沒有按照 開發工具的必要條件 安裝 Git for Windows ，單擊該按鈕後會導向至 Flutter 安裝頁面。

  6. 當提示 Which Flutter template? 的時候，請忽略它。可以按下 Esc。你可以在檢查完開發設定後建立初始測試專案。

下載 Flutter SDK

  1. 當對話框 Select Folder for Flutter SDK 顯示時，選擇你想要安裝 Flutter 的位置。

    VS Code 會開啟你預設的位置。你可以選擇其他位置。

    請考慮 %USERPROFILE% 或 C:\dev 這樣的位置。

  2. 單擊 Clone Flutter。

    在下載 Flutter 時，VS Code 會彈出該通知：

    Downloading the Flutter SDK. This may take a few minutes.

    下載需要一些時間。如果你懷疑下載被掛起，請單擊 Cancel 取消下載後，再重新嘗試安裝。

  3. Flutter 一旦完成下載， 輸出 (Output) 面板就會顯示。

    Checking Dart SDK version...
Downloading Dart SDK from the Flutter engine ...
Expanding downloaded archive...

    成功後，VS Code 會彈出該通知：

    Initializing the Flutter SDK. This may take a few minutes.

    初始化時，輸出 (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...

    該程序還會執行 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?

  4. 單擊 Add SDK to PATH。

    成功後會顯示通知：

    The Flutter SDK was added to your PATH

  5. VS Code 可能會顯示一則 Google Analytics 的通知。

    如果你同意，請單擊 OK。

  6. 在所有 PowerShell 視窗中啟用 flutter：

    1. 關閉，然後重新開啟所有 PowerShell 視窗。

    2. 重新啟動 VS Code。

下載並安裝 Flutter

從歸檔清單中下載 Flutter SDK 壓縮封裝，將壓縮封裝移動到你想要的位置，然後解壓 SDK，以此來安裝 Flutter。

  1. 下載以下 Flutter SDK 最新 stable 版本的壓縮封裝。

    (獲取中…)

    關於其他發布渠道和舊版本，請查閱 Flutter SDK 歸檔清單。

    Flutter SDK 應該會下載至 Windows 預設下載目錄： %USERPROFILE%\Downloads。

    如果你自行更改了下載目錄的位置，那麼請將之後步驟中解壓指令 (Expand-Archive) 的路徑 (-Path) 改為你更改後的路徑。如果你需要查詢當前電腦下載目錄的位置，請查閱 Microsoft Community post

  2. 建立一個資料夾，用於安裝 Flutter。

    Consider creating a directory at %USERPROFILE% (C:\Users\{username}) 或者 %LOCALAPPDATA% (C:\Users\{username}\AppData\Local).

    可以考慮在 %USERPROFILE% (C:\Users\{username}) 或者 %LOCALAPPDATA% (C:\Users\{username}\AppData\Local) 中建立一個目錄。

  3. 將 Flutter SDK 壓縮文件 (zip) 解壓到你想要儲存的目錄中。可以使用以下指令進行解壓。

    C:> Expand-Archive `
    –Path $env:USERPROFILE\Downloads\flutter_sdk_v1.0.0.zip `
    -Destination $env:USERPROFILE\dev\

    完成後，Flutter SDK 應該會位於 C:\user\{username}\dev\flutter 目錄中。

更新 Windows PATH 環境變數

help 幫助

將 Flutter 新增到 PATH 環境變數後，才能在 PowerShell 中執行 Flutter 指令。本節假定你在 %USERPROFILE%\dev\flutter 中安裝了 Flutter SDK。

  1. 按下快捷鍵 Windows + Pause。

    如果你的鍵盤上沒有 Pause 鍵，請嘗試 Windows + Fn + B。

    這將會顯示 系統 > 系統訊息 的視窗。

  2. 單擊 高階系統設定 > 高階 > 環境變數…

    這將會顯示 環境變數 的視窗。

  3. 在 username 使用者變數 的部分中，找到 Path 條目。

    1. 如果存在該條目，請雙擊它。

      這將會顯示 編輯環境變數 的視窗。

      1. 雙擊空白行。

      2. 輸入 %USERPROFILE%\dev\flutter\bin。

      3. 單擊選中 %USERPROFILE%\dev\flutter\bin 條目。

      4. 單擊 上移，直到 Flutter 條目位於清單頂部。

      5. 順著開啟的視窗依次點選 確認（三次）。

    2. 如果條目不存在，請單擊 新建…。

      這將會顯示 新建使用者變數 的視窗。

      1. 在 變數名 框中，輸入 Path。

      2. 在 變數值 框中，輸入 %USERPROFILE%\dev\flutter\bin。

      3. 順著開啟的視窗依次點選 確認（三次）。

  4. 為了啟用這些更改，請關閉並重新開啟任何現有指令提示符和 PowerShell 實例。

如果你已經安裝了所有必要條件和 Flutter SDK，你應該就可以在 Windows 上為開發 Flutter。

設定 Android 開發

在 Android Studio 中設定 Android toolchain

help 幫助

  1. 啟動 Android Studio。

    顯示 Welcome to Android Studio 的對話框。

  2. 按照 Android Studio Setup Wizard 操作。

  3. 安裝以下元件：

    • Android SDK Platform, API 34.0.0
    • Android SDK Command-line Tools
    • Android SDK Build-Tools
    • Android SDK Platform-Tools
    • Android Emulator

  1. 啟動 Android Studio。

  2. 開啟 Settings 對話框，檢視 SDK Manager。

    1. 如果你已經開啟了一個專案，請開啟 Tools > SDK Manager。

    2. 如果顯示 Welcome to Android Studio 的對話框，請單擊 Open 按鈕後面的 More Options 圖示，然後從下拉選單中單擊 SDK Manager。

  3. 單擊 SDK Platforms。

  4. 檢查 Android API 34.0.0 是否已經選中。

    如果 Status 欄顯示 Update available 或 Not installed：

    1. 選擇 Android API 34.0.0

    2. 單擊 Apply。

    3. 當顯示 Confirm Change 對話框時，單擊 OK。

      顯示 SDK Quickfix Installation 完成進度的對話框。

    4. 安裝完成後，單擊 Finish。

      安裝最新的 SDK 後， Status 欄可能會顯示 Update available。這意味著某些額外的系統映象可能尚未安裝。你可以忽略它然後繼續。

  5. 單擊 SDK Tools。

  6. 檢查以下 SDK 工具是否已經選擇：

    • Android SDK Command-line Tools
    • Android SDK Build-Tools
    • Android SDK Platform-Tools
    • Android Emulator

  7. 如果上述任何工具的 Status 欄顯示 Update available 或 Not installed：

    1. 選擇所需的工具。

    2. 單擊 Apply。

    3. 當顯示 Confirm Change 的對話框時，單擊 OK。

      顯示 SDK Quickfix Installation 完成進度的對話框。

    4. 安裝完成後，單擊 Finish。

設定目標 Android 裝置

設定安卓模擬器

help 幫助

要設定 Flutter 應用在 Android 模擬器中執行，請按照以下步驟操作：

  1. 在你的開發電腦上啟用 VM acceleration。

  2. 啟動 Android Studio。

  3. 開啟 Settings 對話框，檢視 SDK Manager。

    1. 如果你已經開啟了一個專案，請開啟 Tools > Device Manager。

    2. 如果顯示 Welcome to Android Studio 的對話框，請單擊 Open 按鈕後面的 More Options 圖示，然後在下拉選單中單擊 Device Manager。

  4. 單擊 Virtual。

  5. 單擊 Create Device。

    顯示 Virtual Device Configuration 的對話框。

  6. 在 Category 下選擇 Phone 或 Tablet。

  7. 選擇裝置，你可以瀏覽或搜尋裝置。

  8. 單擊 Next。

  9. 單擊 x86 Images。

  10. 單擊需要模擬的 Android 版本系統映象。

    1. 如果所需映象的 Release Name 右側有一個 Download 圖示，請單擊該圖標。

      顯示 SDK Quickfix Installation 完成進度的對話框

    2. 下載完成後，單擊 Finish。

  11. 單擊 Next。

    Virtual Device Configuration 會顯示它的 Verify Configuation 步驟。

  12. 如果要重新命名 Android 虛擬裝置 (AVD)，請更改 AVD Name 框中的值。

  13. 單擊 Show Advanced Settings。

  14. 捲動至 Emulated Performance。

  15. 從 Graphics 下拉選單中，選擇 Hardware - GLES 2.0。

    這樣就會開啟 硬體加速 (hardware acceleration).

  16. 檢查你的 AVD 設定。如果已經完備，請單擊 Finish。

    想要瞭解更多有關 AVD 的訊息，請查閱 Managing AVDs。

  17. 在 Device Manager 對話框中，單擊所需 AVD 右側的 Run 圖示。模擬器啟動並顯示所選作業系統的版本和裝置預設的畫布。

設定目標 Android 裝置

help 幫助

你需要一台執行 Android API level 21 或更高版本的安卓裝置，來設定 Flutter 應用在真機 Android 裝置上執行。

  1. 按照 Android 文件 中的說明，在裝置上啟用 開發者選項 和 USB 除錯。

  2. [可選] 如果要利用無線除錯，請按照 Android 文件 中的說明在裝置上啟用 無線除錯。

  3. 安裝 Google USB Driver。

  4. 將裝置插入你的 Windows 電腦。如果裝置發出提示，請授權電腦訪問你的裝置。

  5. 檢查 Flutter 是否能識別連線的 Android 裝置。

    在 PowerShell 中執行：

    c:\> flutter devices

    預設情況下，Flutter 使用 adb 工具所在的 Android SDK 版本。如果要在 Flutter 中使用不同的 Android SDK 安裝路徑，請設定環境變數 ANDROID_SDK_ROOT 為該安裝目錄。

同意 Android 許可證

help 幫助

在使用 Flutter 之前，按照指南安裝所有必要的條件之後，再同意 Android SDK 平台的許可證。

  1. 開啟一個高許可權（管理員）的控制台視窗。

  2. 執行以下指令啟用簽名許可證。

    $ flutter doctor --android-licenses

    如果你在其他時候已經同意了 Android Studio 許可證，該指令將會回傳：

    [========================================] 100% Computing updates...
All SDK package licenses accepted.

    你可以跳過下一個步驟。

  3. 請仔細閱讀每項許可條款後，再同意。

許可證問題故障排除

如何解決查詢 Java 安裝錯誤的問題

你可以遇到了 Android SDK 定位 Java SDK 的問題。

$ flutter doctor --android-licenses

ERROR: JAVA_HOME is set to an invalid directory: /Applications/Android\ Studio.app/Contents/jre/Contents/Home

Please set the JAVA_HOME variable in your environment to match the
location of your Java installation.

Android sdkmanager tool was found, but failed to run
(/Users/atsansone/Library/Android/sdk/cmdline-tools/latest/bin/sdkmanager): "exited code 1".
Try re-installing or updating your Android SDK,
visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions.

這是由於環境變數 JAVA_HOME 設定方式導致的， flutter doctor 指令就會回傳此錯誤。當你在向 JAVA_HOME 新增路徑時，可以在 Android 和 Studio 之間的空格處新增反斜槓，或者用引號將整個路徑包含進來。切記，不能 同時 這樣做。

在合適的 shell 資源檔案中查詢 JAVA_HOME 路徑。

將下面這樣：

export JAVA_HOME="/Applications/Android\ Studio.app/Contents/jre/Contents/Home"

改成：

export JAVA_HOME="/Applications/Android Studio.app/Contents/jre/Contents/Home"

不要在 Android 和 Studio 之間加入反斜槓。

要載入當前更新後的環境變數，請重新載入 shell。本例使用 zsh 資源檔案。

source ~/.zshrc

檢查你的開發設定

help 幫助

執行 Flutter doctor

flutter doctor 指令將檢查 Windows 完整的 Flutter 開發環境的所有元件。

  1. 開啟 PowerShell。

  2. 要檢查所有元件的安裝情況，請執行以下指令。

    C:\> flutter doctor

由於你選擇為 mobile 進行開發，因此不需要 所有 元件。如果你遵循本指南，指令結果應該類似於：

Running flutter doctor...
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.19.0, on Windows A.B chipset, locale en)
[✓] Windows version (Installed version of Windows is version 10 or higher)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[!] Chrome - develop for the web
[!] Visual Studio - develop Windows apps
[✓] Android Studio (version 2023.1 (Hedgehog) or later)
[✓] VS Code (version 1.86)
[✓] Connected device (1 available)
[✓] Network resources

! Doctor found issues in 2 categories.

解決 Flutter doctor 的問題

當 flutter doctor 指令回傳錯誤時，可能是 Flutter、VS Code、Android Studio、連線的裝置或者網路資源出錯。

如果 flutter doctor 指令回傳這些元件中的任何一個錯誤，請使用 verbose 標誌再次執行。

C:\> flutter doctor -v

檢視輸出結果，瞭解可能需要安裝的其他軟體或者需要執行的其他任務。

如果你更改了 Flutter SDK 或其他相關元件的設定，請再次執行 flutter doctor 來檢查安裝。

管理 Flutter SDK

想要瞭解管理 Flutter SDK 安裝的更多訊息，請查閱以下內容。