學習Flutter,首先需要搭建好Flutter的開發環境,下面我將一步步帶領大家搭建開發環境並且成功執行flutter專案。
Flutter環境配置主要有這幾點:
- 系統配置要求
- Java環境
- Flutter SDK
- Android 開發環境
***以下是基於在Window作業系統上安裝和配置Flutter開發環境***
一、系統配置要求?
- 作業系統:Windows 7 SP1 或更高的版本(基於 x86-64 的 64 位作業系統)
- 磁碟空間:除安裝 IDE 和一些工具之外還應有至少 1.64 GB 的空間
- Git環境:要讓 Flutter在開環境中正常使用,就要有git環境
二、Java 環境配置?
這裡需要安裝 Java 環境,因為Flutter是基於Android的,這裡就不多細說
Java環境下載地址:Java Downloads | Oracle
這裡直接下載64位安裝包,解壓一直點下一步下一步就搞定了,預設是安裝到C盤,也可以自己選擇喜歡的位置進行安裝。
怎麼檢測java是否安裝成功呢?
1、進入“黑視窗”:快捷鍵: win+R ,輸入cmd,按下回車
2、可以選擇輸入 java javac java -version 三個doc命令進行檢查
- 輸入java+回車,出現如下結果證明安裝成功:
- 輸入javac,出現如下結果安裝成功:
- 輸入java -version,檢視Java版本,也可以證明你的java安裝成功
三、Flutter SDK?
Flutter SDK下載地址:https://flutter.cn/docs/development/tools/sdk/releases
選擇最新版本下載即可,下載成功後將壓縮包解壓,解壓存放路徑放在你想放置 Flutter SDK 的路徑中(我的是D:\Android\flutter)
?注意:請勿將 Flutter 安裝在需要高許可權的資料夾內,例如 C:\Program Files\?
我們可以在控制檯輸入 flutter 命令看是否安裝成功,如果輸出如下介面就表示flutter安裝成功啦:
不要高興的太早,雖然flutter SDK安裝成功了,但是現在控制檯還不可以使用 flutter 命令操作其他業務,需要將 Flutter 的執行檔案路徑加入到 PATH
環境變數:
?右擊【此電腦】選擇【屬性】==>選擇【高階系統設定】==>選擇【環境變數】,在【使用者變數】一欄中,選擇【Path】這個條目
?雙擊進入Path條目,點選【新建】將你安裝的flutter坐在完整路徑作為新變數的值
然後一直點選確定就OK啦
在將 Path
變數更新後,開啟一個新的控制檯視窗:輸入 flutter doctor 命令,如果它提示有任何的平臺相關依賴,那麼你就需要按照指示完成這些配置。
簡單來看,doctor是醫生的意思,顧名思義就是對flutter環境進行檢查,並將檢測結果以報告形式呈現出來,然後根據檢查報告依次解決現有環境缺陷問題
這裡如果是剛安裝flutter,有些檢查項帶有紅色的[×],我這裡有顯示[√]和[!]
- [×]表示還不能正常執行
- [!]表示還存在一些問題
- 只有全部為[√],系統環境才是完全安裝好,你的檢查報告才是沒毛病的
有叉的選項可自行復制搜尋,都有解決方案的,這裡就不一一例舉了,結尾會列部分叉踩坑解決方案
現在就來看看上述這個警告,根據它的提示,我們只需要執行: flutter doctor --android-licenses ,執行這條命令後,會有一系列選擇,全部選擇y就好(我也不知道它是個啥,感興趣的小夥伴可以自行研究)
然後我們再來執行: flutter doctor
出現這樣全部為√的選項則你的環境就完全安裝好了?
四、設定Android開發環境?
到這裡我們已經正確安裝flutter開發環境,但是還需要配置下Android的開發環境,因為Flutter 依賴 Android Studio 的全量安裝來為其提供 Android 平臺的支援
?安裝 Android Studio
Android Studio下載地址:https://developer.android.google.cn/studio
?安裝Android SDK
Android SDK下載地址:https://www.androiddevtools.cn
進入官網我們首先找到 SDK Tools 選項:
點選下載Android SDK壓縮包:
下載成功並解壓安裝到自定義目錄,解壓後檔案目錄如下:
執行 flutter doctor
確保 Flutter 已經定位到了你的 Android Studio 的安裝位置。如果 Flutter 並未定位到,執行 flutter config --android-studio-dir <directory>
設定你的 Android Studio 的安裝目錄
?建立虛擬機器
首先開啟我們的Android Studio開發工具,第一次安裝開啟介面的左側選擇【Plugin】選項,然後搜尋並安裝【Flutter】外掛,安裝【flutter】外掛的同時一併安裝了【Dart】外掛。
安裝好外掛後,我們建立一個Flutter專案:
這裡需要選擇你的Flutter SDK安裝目錄,點選【Next】,輸入專案名稱:
?注意:專案命名規範一般是單詞小寫,多個單詞之間用_連線,如:hello_world?
填寫完畢後點選【Finish】完成,開啟專案進去介面,選擇工具欄的【Tools】,選擇【SDK Manager】
正確填寫Android SDK所在目錄:
安裝所需工具包(這個可以在後期視情況而定選擇下載,這裡只是做一個演示):
然後同樣在Tools選項下選擇【Device Manager】,點選【Create device】按鈕建立虛擬機器:
這裡自行選擇機型,然後點選【Next】:
選擇一個系統映像並下載(這個過程可能需要幾分鐘):
下載完成後點選【Next】,繼續點選【Finish】完成,然後點選啟動按鈕,等待虛擬機器開啟即可:
?執行flutter專案
虛擬機器啟動後,我們只需要點選編輯器右上角debug就可執行檢視flutter專案:
這一過程可能需要等待一會兒:
至此,我們的flutter專案就成功執行啦~~?
當然,我們修改main.dart檔案內容時,模擬器也是實時更新的:
五、總結?
至此,我們從搭建專案環境到執行flutter專案整個流程梳理完成,再進行一次總結:
- 首先要本身電腦系統配置達到指定要求
- Java 環境搭建
- 獲取Flutter SDK
- 設定Android Studio開發環境
- 建立虛擬機器
*****注意?:本系列均參照Flutter官網進行整理*****