[Flutter] Windows平台Flutter開發環境搭建(Andorid Studio)


前兩天網友在群里說起了Flutter,就了解了一下,在手機上跑了它的demo,直接就被打動了。

雖然網上有很多教程,但真正開始的時候,還是會碰到很多坑。下面詳細的講解Flutter + Android Studio開發環境搭建。

 

Flutter社區和資源傳送門

 

Flutter支持哪些設備和操作系統版本?

移動操作系統:Android Jelly Bean,v16,4.1.x或更新的版本以及iOS 8或更新版本。

移動硬件:64位iOS設備(從iPhone 5S和更新的iPhone型號開始)以及ARM Android設備。

請注意,我們目前不支持:

  • ARM32 iOS設備(iPhone 4,iPhone 5;問題#2089
  • x86 Android設備(問題#9253

我們支持使用Android和iOS設備(包括Android模擬器和iOS模擬器)來開發測試Flutter應用。

我們測試了各種低端到高端手機,但我們還沒有官方設備兼容性保證。

我們不會在平板電腦上進行測試,因此平板電腦上的某些widget可能會出現問題。我們尚未在我們的widget中實施針對平板電腦的改動。

1. 安裝 Java SDK

百度搜索Java sdk,打開官方網站下載。

網址: http://www.oracle.com/technetwork/java/javase/downloads/index.html

下載最新版本的SDK,點擊上圖框出的區域,進入下載頁面。

先接受協議,然后點擊最后一行中的 jdk-10_windows-x64_bin.exe 進行下載。(假設你也是64位電腦!如果不是,自行搜索其它的教程。)

Java JDK就是Java Development Kit.簡單的說JDK是面向開發人員使用的SDK,它提供了Java的開發環境和運行環境。 

Java JRE是Java Runtime Enviroment是指Java的運行環境,是面向Java程序的使用者,而不是開發者。

Java SE 就是包含了JDK和JRE的安裝包。我們下載的就是這個。

下載完成后,開始安裝。

這一步配置好安裝路徑。然后再下一步繼續安裝。

出現安裝jre向導,一樣的配置好路徑下一 步。

jdk 安裝成功。

2. 配置 JDK 環境變量

打開 “我的電腦”->“屬性”->“高級系統設置” 出來系統屬性對話框,然后切換到“高級”選項卡,點擊“環境變量”按鈕打開環境變量配置對話框。

新建系統環境變量 ”JAVA_HOME“

設置JAVA_HOME值為JDK安裝目錄,如  D:\Android\JDK\jdk-10

新建環境變量CLASSPATH

設置CLASSPATH值為: ./;%JAVA_HOME%/lib/tools.jar;%JAVA_HOME%/lib/dt.jar

./;%JAVA_HOME%/lib/tools.jar;%JAVA_HOME%/lib/dt.jar

(注意:點號表示當前目錄,不能省略)

更新系統環境變量Path

將 “;%JAVA_HOME%\bin;” (注意:這里的分號不能省略), 添加到Path 最前面。

將 jre 安裝路徑的bit目錄添加到path。

點擊確定保存。

打開cmd,輸入 java -version 可以查看到我們安裝java版本。

3. 安裝和配置 Git

Flutter需要使用git來獲取,所以需要先安裝 Git。如果已經安裝,請跳過安裝,但需要檢查一下是否設置環境變量。

網址: https://git-scm.com/download/win

我們下載64位的安裝包。下載完成后開始安裝。

安裝完成后,在系統環境變量Path中查看是否存在git的cmd目錄,沒有則添加。

4. 下載 Android Studio

網址: http://www.android-studio.org/index.php/download  (這里的版本是:3.0.1.0)

 

5. 安裝 Android Studio

配置好安裝目錄,Next開始安裝。

安裝完成。運行 Android Studio。

這里如果沒有安裝過,就選“Do not import settings”,否則選擇第一項,並指定路徑。我這里是全新安裝,所以選擇第二項。

點擊OK,android studio 開始啟動。

啟動時會彈出如下圖

這個是設置http代理的,不需要點 Cancel 進入AS安裝向導界面。

點擊next進入UI界面主題選擇界面,可以選擇自己喜歡的風格。

繼續next,下載組件 (Android SDK, NDK,編譯工具等),等待下載完成。

設置好 Android SDK 安裝位置。Next...

下載完成后,點擊 Finish ,然后退出 Android Studio。

Android SDK安裝完畢后,還需要新增一個環境變量:

變量名:ANDROID_HOME 
變量值:E:\Program Files (x86)\AndroidSDK (更新成你真正的SDK位置)

再到Path下,加入下面這段:
%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;

然后重啟電腦,否則后面可能會報找不到Android SDK的錯誤。

友情提醒

這個AndroidSDK文件夾最好不要放到C盤,因為安卓系統的鏡像、以后會用到的各種組件都會存放到這個文件夾,隨着開發量的增加,這個文件夾會越來越大,C盤可能吃不消。

如果是無腦安裝Android Studio和Android SDK的,Android SDK默認是存放到C盤一個隱藏文件夾下的目錄(C:\Users\Administrator\AppData\Local\Android\sdk),就像上圖一樣,把Android SDK文件夾剪切到C盤以外的其他盤,然后在這里改成新的路徑即可。

6. 下載和安裝 Flutter

官網地址: https://flutter.io/

Flutter是開源在Github上的,所以我們可以直接執行下面的命令來下載。 

git clone https://github.com/flutter/flutter.git

或按照片面的步驟來下載Flutter。

注意:Flutter的下載路徑要全英文並且路徑不能有空格!

點擊 Git GUI Here。

點擊 Clone Existing Repository

設置好 Source (https://github.com/flutter/flutter.git)和 Target 目錄。點擊 Clone 開始獲取。

等待下載完成。

注意: 

直接下載超慢,而且不停掉線,舍不得買代理翻牆的童鞋,請配置鏡像服務器地址,查看官方說明:

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

這倆命令只支持mac和linux,在windows下加兩個環境變量:

PUB_HOSTED_URL  https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL  https://storage.flutter-io.cn

完成后,關閉Git,開始配置環境變量。

在Windows系統環境變量中,將Flutter的路徑加入。完成后如圖所示。

安裝 Flutter

打開 Cmd 或 PowerShell (管理員方式),輸入以下命令:

flutter doctor

Flutter 就會自動配置安裝。成功之后再次執行以上命令,會是這樣:

注意:

確保環境變量Path中存在  %systemroot%\System32; 

確保將 Git 的 Cmd 路徑加入 Path。

 

7. 在 Android Studio 中配置 Flutter

打開 Android Studio。

點擊 Settings 打開設置界面。

設置文件編碼,防止亂碼

進入 Editor -> FileEncodings 中,將 Encoding 全部設為 UTF-8, 保持一致,點擊 Apply。

下載安裝Flutter插件

進入 Plugins ,點擊 Browse repositories... 

搜索 Flutter , 找到后點擊右邊的 Install 按鈕,安裝 Flutter IDE 插件。

點擊 Yes, 開始下載安裝。

完成后,再搜索一下 Dart ,看是否已經安裝,如果沒有安裝,同上一樣點擊 Install 下載安裝。

將 Flutter 和 Dart 插件都安裝完成后,點擊確定關閉設置界面,重新啟動 Android Studio。

如圖所示,歡迎界面多出了 Start a new Flutter project 。Flutter 配置完成。

8. 第一個 Flutter Project

在 Android Studio中,點擊 Start a new Flutter project 來開始一個 Flutter 工程。

默認會選中 Flutter Application,用來創建app。后面是創建插件和Package。一開始,我們就創建一個空的Flutter APP 工程就行了。

點擊next,進入下一步。

在這一步,設置好工程名稱,保存位置和描述信息,再次 Next。

在這里設置App的包名,然后點擊 Finish ,向導完成。

Android studio會根據我們的配置,來初始化Flutter工程。

這里候,我們可以接上自己的手機,或者打開Android模擬器,然后選擇該設備。

我們可以通過點擊菜單中 Tools -> Android -> AVD Manager 來管理Android 模擬器。

這里可以修改CPU類型,比如修改CPU為arm64 

 點擊圖上箭頭所指的 Change 按鈕,修改 Android SDK. 

在 Other Images 選項卡中選擇一個版本(我選擇最新的,但還沒下載,所以要點擊 Download 下載回來)

Flutter 支持 Android 4.1(及以后)和 iOS 8.0 及以后的版本。

選擇好后點擊OK就可以了。

然后我們可以打開這個模擬器。啟動好后,它會出來在IDE右上角的設備選擇框中,選擇后就可以用了。

選擇好設備后,我們可以直接點擊 Run 圖標來構建和運行我們的第一個Flutter APK了。

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM