【Flutter 學習筆記】如何建置 Android 應用程式開發環境

閱讀時間約 8 分鐘
raw-image
【Flutter 學習筆記】線上課程教學影片:連結
【Flutter 學習筆記】系列文章目錄:連結
raw-image

這篇文章將帶著大家學習如何在 Windows 和 macOS 上建置 Flutter Android 應用程式開發環境。


硬體需求

在開始之前,請確保您的硬體符合以下規格:

macOS 硬體需求

  • CPU:建議至少 4 核心(8 核心更佳,以提升性能)
  • 記憶體:最少 8GB RAM(建議 16GB,以應對大型專案)
  • 顯示器解析度:至少 1366 x 768(建議 1920 x 1080,以獲得更佳的開發體驗)
  • 可用磁碟空間:至少 44GB(建議 70GB,以便安裝必要的工具和資源)

Windows 硬體需求

  • CPU:建議至少 4 核心(8 核心更佳)
  • 記憶體:最少 8GB RAM(建議 16GB)
  • 顯示器解析度:至少 1366 x 768(建議 1920 x 1080)
  • 可用磁碟空間:至少 44GB(建議 70GB)

軟體需求

請確保您的軟體環境符合以下要求:

  • macOS:macOS 11 (Big Sur) 或更新版本
  • Windows:Windows 10 或更新版本
  • 預設 shell:macOS 使用 zsh(自 macOS Catalina 起的預設 shell),Windows 使用 PowerShell 或 命令提示字元

安裝必要的開發工具

安裝 Android Studio

下載並安裝 Android Studio 2023.3.1 (Jellyfish) 或更新版本。這是開發 Android 應用程式的主要 IDE,提供強大的功能和工具來支援您的開發需求。

安裝 Git

確保您已安裝 Git 2.27 或更新版本。如果尚未安裝,可以使用以下命令:

  • macOS: brew install git
  • Windows: 下載 Git 安裝程式並依指示安裝

安裝 Visual Studio Code

建議安裝 Visual Studio Code 1.77 或更新版本,並安裝 Flutter 擴充功能。這將大大簡化 Flutter 開發流程,並提供更佳的編輯體驗。

安裝 Flutter SDK

您有兩種方式可以安裝 Flutter SDK:

使用 VS Code 安裝

  1. 打開 VS Code
  2. 按下 Command + Shift + P (macOS) 或 Ctrl + Shift + P (Windows) 開啟命令面板
  3. 輸入 "flutter",選擇 "Flutter: New Project"
  4. 如果尚未安裝 Flutter SDK,選擇 "Download SDK"
  5. 選擇 SDK 安裝位置(macOS 建議選擇: 「~/development/」 或 Windows 建議選擇:「C:\development\」)

手動下載安裝

  • 從 Flutter 官網下載最新的穩定版 SDK
  • 解壓縮檔案到您想存放 Flutter 的目錄(macOS 例如: 「 ~/development/flutter」 或 Windows: 「 C:\development\flutter」)

設定環境變數

將 Flutter 加入 PATH 環境變數,以便在終端機中輕鬆使用:

  • macOS: 編輯 ~/.zshenv 檔案(如果不存在則創建),加入以下行:export PATH="$PATH:~/development/flutter/bin"
  • Windows: 在系統環境變數中新增 Flutter 的 bin 目錄路徑(例如 C:\development\flutter\bin)

設定 Android 開發環境

設定 Android Studio

啟動 Android Studio,使用 SDK Manager 安裝以下組件:

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

設定 Android 模擬器

在 Android Studio 中開啟 Device Manager,點擊 "Create Device",選擇設備類型和系統映像。若您的電腦使用 Intel CPU,建議額外安裝並配置硬體加速,以提升模擬器的性能和流暢度。

同意 Android 授權

執行以下命令並同意所有授權,以確保開發環境的正常運作:

  • flutter doctor --android-licenses


設定連結真實 Android 裝置

在您的 Android 裝置上啟用開發者選項和 USB 偵錯功能,然後將裝置透過 USB 傳輸線連接到 Mac 或 Windows 電腦,以便進行實機測試。請確保使用合適的 USB 傳輸線,以確保連接穩定。

開啟開發者選項

在 Android 設備上啟用開發者選項和 USB 偵錯的步驟如下:

  1. 進入設定
    • 打開設備的「設定」應用程式。
  2. 找到版本號碼
    • 滾動至「關於手機」或「關於平板電腦」,尋找「版本號碼」選項。
  3. 啟用開發者選項
    • 連續點擊「版本號碼」七次,直到出現提示「您現在已成為開發人員」。
  4. 開啟 USB 偵錯
    • 返回設定主頁,選擇「系統」>「開發者選項」。
    • 開啟「USB 偵錯」選項,並在彈出窗口中選擇「確定」。

連接設備

  1. 使用 USB 傳輸線連接
    • 將 Android 設備透過 USB 傳輸線連接至電腦。
  2. 允許 USB 偵錯
    • 當設備彈出提示詢問是否允許 USB 偵錯時,選擇「始終允許來自此計算機的調試」。

在 Android Studio 中設置

  1. 打開 Android Studio
    • 啟動 Android Studio 並載入您的專案。
  2. 檢查設備是否被識別
    • 在工具欄中查看設備下拉菜單,確認您的實體設備是否顯示在列表中。如果顯示為「No Devices」,請檢查 USB 連接及驅動程式安裝情況。
  3. 安裝 Google USB Driver(如必要)
    • 若設備未被識別,可能需要安裝 Google USB Driver。可透過 SDK Manager 進行安裝。

測試應用程式

    • 在 Android Studio 中,點擊綠色的播放按鈕(Run),選擇您的實體設備作為運行目標。

驗證安裝

執行以下命令檢查環境設定,確保所有必要組件都已正確安裝:

  • flutter doctor
    解決任何報告的問題,確保開發環境的完整性。

開始開發

恭喜!您現在已經成功設置了 Flutter Android 應用程式開發環境。接下來,您可以:

  • 創建您的第一個 Flutter 專案
  • 學習 Dart 程式語言
  • 學習 Flutter 基礎知識
  • 探索 Flutter 官方文件和教程,進一步提升您的開發技能

結語

透過本指南,您已經在 macOS 和 Windows 上成功建立了 Flutter Android 應用程式開發環境。Flutter 的強大和靈活性將為您的移動應用開發帶來全新的體驗。記得經常更新您的 Flutter SDK 和相關工具,以獲得最新的功能和改進,保持您的開發環境始終處於最佳狀態。

祝您的 Flutter 開發之旅一切順利!如果在過程中遇到任何問題,別忘了查閱 Flutter 官方文件或尋求社群支援,讓我們一起在這個充滿創意的開發世界中探索更多可能性!

    10會員
    230內容數
    哈囉!歡迎光臨我的沙龍!我是 KT,一位對應用程式開發充滿熱情的開發者。在這個專屬空間,我將與您分享我在應用開發領域的深入學習心得和豐富的實戰經驗。如果您對應用程式開發技術同樣充滿好奇,渴望不斷探索新知,歡迎成為我們的會員,一起在應用程式開發的旅途上,探索更深層次的技術世界,享受學習的樂趣。
    留言0
    查看全部
    發表第一個留言支持創作者!
    HKT實驗室 的其他內容
    本文介紹 macOS 環境開發 iOS 應用程式。先列硬體規格與軟體需求,包括處理器、記憶體等要求和作業系統、開發工具版本要求。然後詳述開發環境設置步驟,像安裝 Flutter SDK 等。也介紹配置 iOS 模擬器和實體設備的方法。最後提及如何檢查開發環境,以及開始開發 iOS 應用的諸多建議。
    Shell 是人和電腦溝通的橋梁。介紹圖形化介面(GUI)和命令列介面(CLI),GUI 好上手,CLI 適合開發者。說明 macOS 終端機與 Shell 的關係,如預設 Shell 是 zsh。還講到查看、安裝、切換 zsh 的方式,基本指令、檔案操作、flags 用途等。
    介紹在 macOS 上安裝 Flutter SDK 的三種主要方法。第一種是從 Flutter 官方網站手動下載並安裝。第二種方法是通過 Visual Studio Code 整合式開發環境安裝。第三種方法則是使用命令列工具,如 Chocolatey 。讀者可根據需求選擇合適的安裝方式。
    介紹在 Windows 上安裝 Flutter SDK 的三種主要方法。第一種是從 Flutter 官方網站手動下載並安裝。第二種方法是通過 Visual Studio Code 整合式開發環境安裝。第三種方法則是使用命令列工具,如 Chocolatey 。讀者可根據需求選擇合適的安裝方式。
    主要介紹 Windows 和 macOS 的 Flutter 開發環境。需下載安裝 Flutter SDK 、 Visual Studio Code 、Android Studio 等相關可以開發 Android app; macOS 則需安裝 Xcode 等相關可以開發 iPhone app 。
    本文專為 Flutter 開發者設計的實用指南,內容涵蓋了 Flutter SDK 的安裝、開發環境的設置、Dart 語言的核心概念、常用 UI 元件的應用及其實作等重要主題。透過豐富的實際範例和詳細的說明,讀者將能夠輕鬆掌握 Flutter 的基本概念,快速上手開發高效能的應用程式。
    本文介紹 macOS 環境開發 iOS 應用程式。先列硬體規格與軟體需求,包括處理器、記憶體等要求和作業系統、開發工具版本要求。然後詳述開發環境設置步驟,像安裝 Flutter SDK 等。也介紹配置 iOS 模擬器和實體設備的方法。最後提及如何檢查開發環境,以及開始開發 iOS 應用的諸多建議。
    Shell 是人和電腦溝通的橋梁。介紹圖形化介面(GUI)和命令列介面(CLI),GUI 好上手,CLI 適合開發者。說明 macOS 終端機與 Shell 的關係,如預設 Shell 是 zsh。還講到查看、安裝、切換 zsh 的方式,基本指令、檔案操作、flags 用途等。
    介紹在 macOS 上安裝 Flutter SDK 的三種主要方法。第一種是從 Flutter 官方網站手動下載並安裝。第二種方法是通過 Visual Studio Code 整合式開發環境安裝。第三種方法則是使用命令列工具,如 Chocolatey 。讀者可根據需求選擇合適的安裝方式。
    介紹在 Windows 上安裝 Flutter SDK 的三種主要方法。第一種是從 Flutter 官方網站手動下載並安裝。第二種方法是通過 Visual Studio Code 整合式開發環境安裝。第三種方法則是使用命令列工具,如 Chocolatey 。讀者可根據需求選擇合適的安裝方式。
    主要介紹 Windows 和 macOS 的 Flutter 開發環境。需下載安裝 Flutter SDK 、 Visual Studio Code 、Android Studio 等相關可以開發 Android app; macOS 則需安裝 Xcode 等相關可以開發 iPhone app 。
    本文專為 Flutter 開發者設計的實用指南,內容涵蓋了 Flutter SDK 的安裝、開發環境的設置、Dart 語言的核心概念、常用 UI 元件的應用及其實作等重要主題。透過豐富的實際範例和詳細的說明,讀者將能夠輕鬆掌握 Flutter 的基本概念,快速上手開發高效能的應用程式。
    你可能也想看
    Google News 追蹤
    Thumbnail
    這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
    Thumbnail
    11/20日NVDA即將公布最新一期的財報, 今天Sell Side的分析師, 開始調高目標價, 市場的股價也開始反應, 未來一週NVDA將重新回到美股市場的焦點, 今天我們要分析NVDA Sell Side怎麼看待這次NVDA的財報預測, 以及實際上Buy Side的倉位及操作, 從
    Thumbnail
    Hi 大家好,我是Ethan😊 相近大家都知道保濕是皮膚保養中最基本,也是最重要的一步。無論是在畫室裡長時間對著畫布,還是在旅途中面對各種氣候變化,保持皮膚的水分平衡對我來說至關重要。保濕化妝水不僅能迅速為皮膚補水,還能提升後續保養品的吸收效率。 曾經,我的保養程序簡單到只包括清潔和隨意上乳液
    Thumbnail
    這篇內容,將教你如何安裝GameMaker,並更改語言設定。包括GameMaker的下載說明、版本說明、安裝說明、語系更改。
    Thumbnail
    此章節旨在引導讀者如何建立Java開發環境,包括安裝JDK、使用命令行工具編寫和運行Java程式,以及如何在Visual Studio Code、IntelliJ IDEA和Eclipse等IDE中設置和使用Java環境。
    Thumbnail
    你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
    Thumbnail
    本章節提供了設置Kotlin開發環境的多種選擇,包括使用IntelliJ IDEA、Android Studio、命令行工具、Visual Studio Code,以及在線編輯器。每種方法都有詳細的步驟說明,旨在幫助讀者根據自己的需求選擇最適合的設置方式,並順利開始Kotlin開發。
    Thumbnail
    本章節介紹了如何建立並設置Swift項目以及如何選擇和設置Swift代碼編輯器。這包括在Xcode和命令行中建立Swift項目,選擇Xcode、Visual Studio Code或AppCode作為編輯器,以及如何使用SPM安裝插件。
    Thumbnail
    # 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
    Thumbnail
    有沒有想過,即使沒有任何編程背景,你的創意也能在六個月內轉化成真實的App?我可以以自身經歷跟你說有了 No-Code Tool (無代碼工具) 和 AI 的幫助,這一切都是可能的!你一行 code 都不需要打,甚至也無須學習任何編程語言!沒有什麼比實踐一個自小認為不可能的任務還振奮人心的事了!
    本課程學習如何添加 Room 資料庫相關依賴庫配置。
    Thumbnail
    這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
    Thumbnail
    11/20日NVDA即將公布最新一期的財報, 今天Sell Side的分析師, 開始調高目標價, 市場的股價也開始反應, 未來一週NVDA將重新回到美股市場的焦點, 今天我們要分析NVDA Sell Side怎麼看待這次NVDA的財報預測, 以及實際上Buy Side的倉位及操作, 從
    Thumbnail
    Hi 大家好,我是Ethan😊 相近大家都知道保濕是皮膚保養中最基本,也是最重要的一步。無論是在畫室裡長時間對著畫布,還是在旅途中面對各種氣候變化,保持皮膚的水分平衡對我來說至關重要。保濕化妝水不僅能迅速為皮膚補水,還能提升後續保養品的吸收效率。 曾經,我的保養程序簡單到只包括清潔和隨意上乳液
    Thumbnail
    這篇內容,將教你如何安裝GameMaker,並更改語言設定。包括GameMaker的下載說明、版本說明、安裝說明、語系更改。
    Thumbnail
    此章節旨在引導讀者如何建立Java開發環境,包括安裝JDK、使用命令行工具編寫和運行Java程式,以及如何在Visual Studio Code、IntelliJ IDEA和Eclipse等IDE中設置和使用Java環境。
    Thumbnail
    你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
    Thumbnail
    本章節提供了設置Kotlin開發環境的多種選擇,包括使用IntelliJ IDEA、Android Studio、命令行工具、Visual Studio Code,以及在線編輯器。每種方法都有詳細的步驟說明,旨在幫助讀者根據自己的需求選擇最適合的設置方式,並順利開始Kotlin開發。
    Thumbnail
    本章節介紹了如何建立並設置Swift項目以及如何選擇和設置Swift代碼編輯器。這包括在Xcode和命令行中建立Swift項目,選擇Xcode、Visual Studio Code或AppCode作為編輯器,以及如何使用SPM安裝插件。
    Thumbnail
    # 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
    Thumbnail
    有沒有想過,即使沒有任何編程背景,你的創意也能在六個月內轉化成真實的App?我可以以自身經歷跟你說有了 No-Code Tool (無代碼工具) 和 AI 的幫助,這一切都是可能的!你一行 code 都不需要打,甚至也無須學習任何編程語言!沒有什麼比實踐一個自小認為不可能的任務還振奮人心的事了!
    本課程學習如何添加 Room 資料庫相關依賴庫配置。