創建你的第一個Flutter應用程序


前言

Flutter,Google推出的跨平台開發框架。就在前幾天,Flutter的首個發布預覽版(Release Preview 1)正式發布! 即將迎來Flutter 正式版(1.0)。本篇將帶你創建第一個Flutter應用(Windows環境)。


安裝

1.下載Flutter SDK

Flutter SDK 點擊下載

1-1.點擊上面地址下載Flutter SDK,將下載的zip文件解壓后復制到所需安裝位置,我是直接放在 C:\flutter 。盡量不要放在C:\Program Files 之類需要訪問權限的目錄下。

1-2.進入flutter文件夾,找到flutter_console.bat,雙擊運行。

 

 

2.配置Flutter環境變量

 

 

3.Flutter完善配置

此項以安裝好Android Studio和SDK為基礎。在flutter_console控制台中輸入 flutter doctor來查看是否需要安裝依賴項來完成設置。

 

X表示Flutter未正確配置的選項。

下面開始windows下踩坑:

(1)坑1

  • 報錯
Error: The Flutter directory is not a clone of the GitHub project. The flutter tool requires Git in order to operate properly; to set up Flutter, run the following command: git clone -b beta https://github.com/flutter/flutter.git
  • 解決方法

    把剛剛下載的Flutter安裝包刪掉,重新在想要安裝的目錄下運行git clone -b beta https://github.com/flutter/flutter.git

(2)坑2

  • 報錯
    重新運行flutter doctor,這個時候又給我報錯說:

    此時不應有 \flutter\bin\cache

    網上找了一下都沒有說報這個錯誤的,然后想起官網有句話說:

    將安裝包zip解壓到你想安裝Flutter SDK的路徑(如:C:\src\flutter;注意,不要將flutter安裝到需要一些高權限的路徑如C:\Program Files\)。

    發現我是將clone下來的項目放在了D:\Program Files (x86)下了,所以

  • 解決方法
    把項目放在一個普通的文件夾下。

【提示】這里注意下,如果你的Flutter的安裝目錄改變了,記得去更改它的環境變量的路徑。然后重啟電腦,再運行flutter doctor

(3)坑3

  • 報錯
  •  

  • 解決方法

這里一般是網絡問題,確保是否更新了環境變量

3-1.Android toolchain - develop for Android devices。
X Unable to locate Android SDK

上述錯誤表示Flutter無法定位到Android SDK的正確路徑。但是,我已經正確的安裝SDK,在環境變量中對SDK進行了配置。為啥還會報這個錯誤呢?

原因以及解決方法:Flutter 定位Android SDK是以SDK的默認安裝路徑為基礎,當你的SDK安裝路徑不是默認路徑的話,你要在環境變量中通過 %ANDROID_SDK%配置Android SDK,Flutter才能正確定位到SDK路徑。

 

 

3-2.Connected devices
! No devices available

解決方法:手機將開發者選項打開 – USB調試打開即可。

按照上述解決方案解決問題后再次執行 flutter doctor

 

 

3-3.問題:Android toolchain - develop for Android devices(Android SDK 28.0.0)

解決方案:執行命令 flutter doctor –android-licenses即可。

OK,這是我在配置Flutter時候遇到的問題,大家遇到相同的問題按照上述解決方法解決即可。

4.Android Studio創建Flutter應用

 

 

按照圖示在Android Studio中添加Flutter依賴,重啟Android Studio , Dart默認的和Flutter進行了綁定。

在Android Studio中 通過File – New – New Flutter Project 創建一個新的Flutter工程。

 

1.選擇創建Flutter應用

 


2.創建應用相關信息

 


3.Flutter代碼頁面

 


4.選擇設備執行項目

 

 

 

到這里第一個Flutter 應用就創建好了。接下來正式開啟Flutter學習之旅吧。


免責聲明!

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



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