why flutter
1，強大的跨平臺
現在flutter至少可以跨5種平臺（ MacOS, Windows、 Linux、 Android、 iOS）， 甚至可以在，甚至支援嵌入式開發（niubility！）。甚至可以在谷歌最新的作業系統 Fuchsia上執行 。 到目前為止， Flutter算是支援平臺最多的框架了！
2，優秀的元件支援
flutter內建驚豔的 Material Design (that's my shit!) 和 Cupertino 風格(蘋果風格，暫不是很全)元件、豐富的 motionAPI給你最靚的使用者體驗。
3，晌應式框架
使用 Flutter的響應式框架和一系列基礎元件，可以輕鬆構建你的各種介面。
4，支援外掛
通過 Flutter 的外掛可以訪問平臺本地 API，如相機、藍芽、 WiFi 等 。 藉助現有的 Java、 Swift、 Objectiv C、 C++程式碼實現對原生系統的呼叫 。
5，超高效能
Flutter採用 GPU渲染技術，所以效能極高。 Flutter編寫的應用是可以達到 60fps，這也就是說，它完全可以勝任遊戲的製作 。 官方宣稱用 Flutter開發的應用甚至會超過原生應用的效能。
PS：小聲說，flutter在ios的流暢度和android比還是相差有點大的，具體原因嘛，emmmmm....
flutter特點
這裡提到的都是flutter的主要特點，是我們編寫flutter的基本意識！ 如果有不理解的，先記住結論，後面的文章會有詳解的。
!important 一切皆為元件（widget）
在flutter中一切皆為元件，這句話非常重要，我們在開始寫flutter之前，一定要有這樣的意識。這樣我們就能更好地上手學習。 在flutter裡，幾乎任何東西都是元件，不僅是常見的ui元件，甚至是佈局方式，樣式，動畫等都是widget（元件）
Widget 可以定義為 :
- 介面元件(如按鈕或輸入框) 。
- 文字樣式(如字型或顏色) 。
- 佈局(如填充或滾動) 。
- 動畫處理(如緩動) 。
- 手勢處理( GestureDetector)。
每個Widget都具有豐富的屬性及方法 ，屬性通常用來改變元件的狀態(顏色、大小等)及事件回撥方法的處理(單擊事件回撥、手勢事件回撥等)。 方法主要是提供一些元件的功能擴充套件。
元件巢狀
元件巢狀可以說是flutter的一個特色，也可以說是一個噁心之處，上面說過flutter裡一切皆為元件，所以在複雜的介面裡不可避免的會出現各種深層元件巢狀。有時候比回撥地獄還噁心。
PS：左邊的缺角就像被街霸的肯，發了個“好喲跟”
元件狀態
和react一樣，flutter也是元件化的思想，其中狀態（state）就是一個元件的UI資料模型，是元件渲染時的資料依據。Flutter程式的執行可以認為是一個巨大的狀態機， 使用者的操作、請求 API 和系統事件的觸發都是推動狀態機執行的觸發點，觸發點通過呼叫 setState 方法推動狀態機進行響應 。
無狀態元件與有狀態元件
元件又分為兩大類：
- 無狀態元件（繼承自StatelessWidget）：初始化後無法修改其狀態和UI，如 Text、Assetlmage等
- 有狀態元件(繼承自StatefulWidget)：其狀態可能在Widget生命週期中發生變化。如 Scrollable、Animatable等。注意：在呼叫setState後，元件類會重新繪製，建立其新的widget
PS：StatefulWidget | StatelessWidget 共性:都繼承自Widget
所以我們在編寫元件時，同樣也要有狀態意識，首先判斷它是有狀態的還是無狀態的。
如果 Widget 需要根據使用者互動或其他因素進行更改，則該 Widget 是有狀態的 。 當你建立一個有狀態元件，則它須繼承自StatefulWidget。並且建立的元件的狀態也會儲存在state的子類中。後面當你需要改變元件的狀態時，必須呼叫setState方法來通知flutter來更新建立新的widget。
學習建議
學習一種新框架，新語言。我覺得有三點是非常重要的。
- 1，完善詳細的文件和資料
- 學習flutter可以說是我見過的，官方對中文支援最友好的，沒有之一。雖然flutter是由谷歌開發的，但中國卻是使用最多的國家。自然官方也是相當重視的，它擁有幾乎和英文同步的中文文件，幾乎所有官方視訊都有中文字幕，以及中文的codelabs。所以學習flutter真的是一件門檻很低的一件事。
- 2，擁有可以方便快速，執行程式碼的環境
- 這個是必須條件，補充一下，官方特意為中國提供了線上的dart執行環境，
- 3，擁有可以學習模仿的專案程式碼
- 這個是很重要的，當你學習一種新的語言和框架，難免會遇到各種各樣的坑。這時如果有一份優秀的專案程式碼可以給你參考和模仿。會幫助你少走很多彎路，也會幫助你養成良好的編碼規範。
- 補充：4，第四點就是用新框架寫一個新專案。一般情況下這個專案會是公司專案，但如果你能寫一個自己的專案，根據自己的意願去設計去研究並最後實現，往往會取得更好的效果。你的收穫也將是最多的！
務必儲存的網址
前面說過flutter對中國市場的重視，所以它們是有詳細完善到髮指的中國官網，速度快，且不需要翻牆。PS：不要用百度查flutter，你搜到的第一個根本不是flutter官網！！！ 它是早期的一個熱心網友翻譯官網文件的網站。現在已經完全不能和官中網站比，大家不要進錯了，有梯子的還是儘量用谷歌，不要用百度了。
- 官方中文網站： flutter.cn/ 這裡擁有最新最詳細的中文文件。詳細的分類，甚至為web，ios，android，RN開發者分別提供了不同的開發指南。
- Flutter codelabs： codelabs.flutter-io.cn 當你想要檢驗你的flutter，它會為你提供詳盡的程式碼任務，每個任務都會有詳盡的步驟，幾乎手把手教你進行程式設計。在學習初期，進行知識的鞏固非常有效果。
- awesome-flutter： github.com/Solido/awes… 看見awesome，大家都懂，這裡包含了許多和flutter相關，且質量優秀的專案。
- Dart官方中文網站： dart.cn/ flutter使用的不是JS而是自家的dart，一種借鑑了java，c++，JavaScript的語言。所以它也是必須要掌握的。
- Dart線上環境： dartpad.cn/ 學習一種語言，必須要有對應的環境。dart不像JS是可以直接在瀏覽器的console裡執行。而這個官方線上環境則很好地進行了彌補。多說一句：遇到任何不懂的問題，就敲出來，跑起來進行驗證！
PS：flutter和dart的官方中文文件。每段中文，點選後都會顯示對應的原版英文文件，很貼心。這對那些想學習英語，尤其那些程式設計術語的，提高閱讀英文文件，真的很有幫助！
flutter映象配置
關於不同平臺安裝flutter官方 已經很詳細了，這裡我就不bb了，湊字數了。這裡只提下flutter映象設定。
如果你看不懂網上和官方那些教你配置映象的教程。這裡告訴一個更直接的辦法：
- 直接在你安裝flutter的地方，查詢叫
.bash_profile的隱藏檔案。 - 用文字編輯器開啟，直接貼上上這兩行,最後儲存就行了。
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
複製程式碼這樣你就儲存了社群主映象，它採用多種方式同步 Flutter 開發者資源，也是官方推薦的。
學習的flutter專案
當你在學習一個新框架時，模仿學習別人優秀的程式碼，往往是最好的老師。這裡我簡單列舉三個專案以供參考：
- flutter gallery：這個是官方的示例app，裡面有flutter的各種使用場景，是我們學習模仿的模板。傳送門
- HistoryOfEverything：這也是官方在一個分享會裡推薦的一個app。它有著令人驚訝的動畫表現力和流暢度(小聲說：至少android是這樣的)。對，它呈現的就是那些，你們之前說的那些追著ui打的動效。傳送門
- Flutter-Story-App-UI：這個專案是我在油管上看到的，顯示效果也是真的不錯。作者：devefy 其他的flutter專案也具有很好的參考價值 傳送門
推薦的這幾個專案，都是之前我們常說的不能讓ui看見或者追著ui打的設計。但是在flutter的加持下，它們變得不再那麼難以實現。
最後再推薦一個flutter工具：fluttergo
這個軟體可以直接在應用市場下，它是由阿里一些工程師利用摸魚時間做的一個app。
- 裡面包含了全網最新的flutter文章和新聞。
- 裡面包含了大部分flutter元件的效果展示和對應的屬性方法說明
後續
這是一系列的文章，後面會盡量做到一兩個星期一更新，想看最新的可以關注下面 我的github筆記地址
我的github筆記地址：
我之前的筆記都是存在本地的，現在決定全部同步到github上，想看最新的可以關注，我會盡量做到每天一更。傳送門