
作為一名合格的開發人員,我們應該積極地去擁抱新的事物,當然這個想法也不限於技術,加油!
Flutter 瞭解一下
Flutter是谷歌的移動UI框架,可以快速在iOS和Android上構建高質量的原生使用者介面。 Flutter可以與現有的程式碼一起工作。在全世界,Flutter正在被越來越多的開發者和組織使用,並且Flutter是完全免費、開源的。瞭解更多
Flutter用什麼語言開發?
採用了Dart作為開發框架和widget的語言。底層圖形框架和Dart虛擬機器在C /C++中實現。 更多問題,更多思考!
接下來~ 安裝 Flutter, get it!!

列一個安裝清單
- Flutter SDK
- Dart
- Android Studio
- Android Studio Flutter 外掛
- Android 虛擬機器
- vscode Flutter 外掛
Flutter SDK 安裝配置 Dart 安裝
這一步呢! 其實~
Dart 安裝程式 下載地址: www.gekorm.com/dart-window… Flutter SDK 下載地址: flutter.dev/docs/develo…
Dart 安裝~
- 直接跟著安裝導向走就可以了,如果出現網路錯誤,那你就需要那啥了

Flutter 安裝~
- 將下載的壓縮包解壓到你自己目錄
- 在根目錄下找到
flutter_console.bat
開啟它,輸入flutter --version
可以看到版本資訊即我們下載的包沒問題 - 然後在配置一下系統的環境變數, 到這一步我們的 Flutter 就算安裝完成了~
- 再輸入
flutter doctor
檢查一下,還有什麼問題~
等等,這……

這說明我們還缺少一些依賴~
再輸入 flutter doctor --android-licenses
根據提示一路 yes
這是為了安裝一些證書……
接下在我們就需要安裝 Android Studio
和 虛擬機器
了
Android Studio 安裝配置 Flutter 環境
Android Studio 下載地址: developer.android.google.cn/studio/
Android Studio 按照安裝導向一步一步走即可~

安裝 Flutter 外掛

安裝完成後再重啟一下 IDE

到這來我們就可以建立我們的 Flutter 專案了

根據提示 建立一個
Flutter
專案,這個時候還不能執行,它會提示我們沒有虛擬機器,需要安裝我們的虛擬機器來除錯我們的Flutter
專案
再次輸入 flutter doctor
檢查一下 Flutter
沒有檢測到任何虛擬機器裝置,另外我們可以看到Android Studio
安裝成功了

安裝 虛擬機器

選擇一個機型,我選擇的是 pixel 2
然後根據提示 缺什麼下載什麼 即可,這個過程會比較久;各位小夥伴一定要耐心等待啊

tips: 記下這個虛擬機器的名字,下面有用,(名字可以隨意起)
如果你也遇到這個問題的話~ 那麼你的 CUP 要開啟支援虛擬化 解決方法:進入你的電腦主機板 BIOS 找到 Intel Virtual Technology 選項 設定為 Enabled

開啟這個後就可以開啟一個虛擬機器了

告別用 Android Studio 開啟虛擬機器
建立一個系統指令碼,快速開啟 虛擬機器 告別
Android Studio
, 讓vscode
C 位出道~
新建一個字尾名位 .bat
的檔案 如:emulator.bat
, 寫入一下內容
tips: 有可能你的 emulator.exe
路徑不一樣
C:\Users\ce\AppData\Local\Android\Sdk\emulator\emulator.exe -netdelay none -netspeed full -avd Pixel2API28
複製程式碼
-avd Pixel2API28
這個是你的虛擬機器的名字
儲存,不出意外雙擊它就可以開啟虛擬機器了;

走到這一步離我們 成功已經走過 90% 了

配置 vscode 支援 Flutter 開發環境,除錯一下
安裝
Flutter
外掛
- 開啟虛擬機器
- 開啟命令列工具輸入
flutter create my_flutter_app
建立專案 - vs code 開啟 專案
- 再輸入
flutter run

到這裡就成功配置完成了

各位同仁這一步只是萬里長征的第一步,接下來還有漫長的路要走,Flutter 現在搭建環境還是有點麻煩,相信以後一定會有更好的辦法,拭目以待。
如有疑問歡迎來訪: cjp96@qq.com
coding is intersting, this man is Roman Reigns
