因為社群關係,個人對於 Flutter 相當有興趣,最近終於有機會接觸一下這兩項技術。Flutter 是一個能夠跨平台的框架,透過 dart 語言撰寫,可同時提供 iOS、Android、Web 應用程式與桌面應用程式使用,相當方便。 Flutter 本身提供了許多套件 (Library) 與元件(Widget) 可供開發人員使用,其 SDK 會將程式碼轉譯為 Android 與 iOS 可以讀取的程式碼,達到跨平台效果。本篇文章將簡單紀錄如何安裝 Flutter,過程相當簡單,若有興趣的朋友可以參考。




安裝 Flutter

步驟 1. 開啟 Flutter Windwos 安裝文件。點選 flutter_windows_3.0.0-stable.zip 按鈕 (您也可以透過該網頁提供Git 方式下載)





步驟 2. 解壓縮檔案,並將檔案重新命名 flutter (可依據喜好放置與命名)



步驟 3. 設定環境變數:在使用者變數內找到 Path,點選編輯,加入上一個步驟安裝路徑+\bin (我放在 F:\fultter,所以路徑為 F:\flutter\bin)。完成後點選確定。




步驟 4. 開啟命令提示字元,輸入where flutter dart 指令,若出現下列畫面即表示安裝成功





步驟 5. 輸入指令 flutter doctor,會幫您檢查缺少那些工具與套件。 (請善用此功能,初期如手機模擬器與 Android SDK 等工具)






安裝開發工具 - Android Studio

您可以透過 Android、 IntelliJ 或 Visual Studio Code 三種不同開發具進行開發,我們使用 Android Studio 進行說明 (相關說明請參考 Set up an editor)

步驟 1. 下載 Android Studio 並進行安裝 (不贅述)

步驟 2. 開啟 Plugin preferences (File > Settings > Plugins),選擇 Marketplace,搜尋 Flutter plugin 與 dart 兩個套件,並進行安裝。







步驟 3. 重啟 Android Studio,然後點選 New Flutter Project





步驟 4. 我們選擇 Flutter,設定 Flutter SDK 安裝位置,點選下一步





步驟 5. 輸入專案名稱(小寫+_ ) 與相關設定,點選完成開始建立專案





步驟 6. 若您是第一次安裝設定 Android Studio,我們要設定模擬器(裝置)





步驟 7.  選擇您要的裝置後,點選 Next。





步驟 8. 點選 Next (若無安裝相關套件或 HAMX,可以在此業一併安裝)





步驟 9. 依據需求設定,點選 finish 完成裝置設定






步驟 10. 選擇好模擬器裝置,點選上方 Run 按鈕,測試是否可以成功啟動,確認所有安裝程序皆成功。




啟動畫面如下 (表示所有安裝與設定皆完成)