flutter是谷歌的移動UI框架，可以快速在iOS和Android上構建高質量的原生用戶界面。 Flutter可以與現有的代碼一起工作。在全世界，Flutter正在被越來越多的開發者和組織使用，并且Flutter是完全免費、開源的。

框架概況

Flutter是谷歌的移動UI框架 [4] ，可以快速在iOS和Android上構建高質量的原生用戶界面。 Flutter可以與現有的代碼一起工作。在全世界，Flutter正在被越來越多的開發者和組織使用，并且Flutter是完全免費、開源的。它也是構建未來的Google Fuchsia [1] 應用的主要方式。
Flutter組件采用現代響應式框架構建，這是從React中獲得的靈感，中心思想是用組件(widget)構建你的UI。 組件描述了在給定其當前配置和狀態時他們顯示的樣子。當組件狀態改變，組件會重構它的描述(description)，Flutter會對比之前的描述， 以確定底層渲染樹從當前狀態轉換到下一個狀態所需要的最小更改。
 

發展歷史

Flutter的第一個版本被稱為“Sky”，運行在Android操作系統是。它是在2015年Dart開發者峰會 [3] 上亮相的，其目的是能夠以每秒120幀的速度持續渲染。
Beta
Beta1版本于2018年2月27日在2018 世界移動大會公布 [5] 。
Beta2版本2018年3月6日發布 [6] 。

Windows

1. 下載安裝包

因為下載安裝包需要一定的時間，所以先把進行安裝包的下載。可以去官網下載：Download Flutter 可以去 Flutter github 下載安裝包：Download Flutter Zip

2. 配置環境變量

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

在 等待下載 過程中配置一下環境變量

1. 右鍵我的電腦(此電腦) > 屬性 > 高級系統保護設置 > 高級 > 環境變量  

2. 在 系統變量 下點擊新建（可以將上面代碼復制）： 

在 下載完安裝包 后，

1. 把它解壓到你想安裝 Flutter SDK 的路徑（我是在 C:/src/flutter） 
2. 在 系統變量 下檢查是否有名為“Path(PATH)”的條目: a. 如果該條目存在，左鍵雙擊擊進入該項 編輯 > 新增 b. 如果條目不存在, 點擊下面 新建, 變量名為 Path ，變量值為 C:/src/flutter/bin 

3. 運行 Flutter doctor

1. 打開 Flutter console 

2. 輸入 flutter doctor, 檢查還需要安裝的項目 如上圖，顯示 [X] 的為沒有安裝的項目

   • 如果是前端仔，建議用 VScode，跳到 VSCode Flutter 配置
   • 如果是安卓仔，那就直接可以用 Android Studio

4. 配置 VSCode

1. 打開命令面板(快捷鍵：Ctrl + Shift + P)
2. 安裝擴展，搜索 flutter點擊安裝，發現 Dart 也一起安裝好了
3. 驗證
   • 打開命令面板
   • 輸入 'doctor'，選擇 'Flutter: Run Flutter Doctor'
   • 查看 “OUTPUT” 窗口中的輸出是否有問題
4. 創建項目
   • 打開命令面板
   • 選擇 'Flutter: New Project'
   • 項目命名，遵循谷歌下劃線命名，使用駝峰命名會報錯

5. 配置移動設備

1. 將自己的手機連接到電腦，打開發者模式（連續點擊版本號） 
2. 進入開發者選項，打開 USB 調試（不同手機'開發者選項'在不同位置，自行百度）
3. 檢查是否連接成功
4. 按 F5 鍵或點擊 調試>啟動調試(Debug>Start Debugging)，等待手機出現畫面 
5. 體驗熱重載
   • 打開 main.dart文件
   • 找到 home: new MyHomePage(title: 'Flutter Demo Home Page'),
   • 把 title 里的內容改為 VSCode Flutter Demo
   • 保存(ctrl-s)， 就可以在手機上看到更改了