1.flutter是什么势腮？
2018年2月27日誉简，在2018世界移動大會上楷扬，Google發(fā)布了Flutter的第一個Beta版本翘鸭。Flutter是Google用以幫助開發(fā)者在Ios和Android兩個平臺開發(fā)高質(zhì)量原生應(yīng)用的全新移動UI框架，點擊查看Flutter介紹視頻鸳址。
flutter特點和特性
- 熱重載（Hot Reload）瘩蚪，flutter使用了dart作為底層開發(fā)語言，其中一個很重要的原因是可以支持熱加載稿黍。
- 一切皆為Widget的理念募舟，對于Flutter來說，應(yīng)用里的所有東西都是Widget闻察，通過可組合的空間集合、豐富的動畫庫以及分層課擴(kuò)展的架構(gòu)實現(xiàn)了富有感染力的靈活界面設(shè)計琢锋。
- 借鑒了React的設(shè)計理念辕漂，引入了虛擬DOM的概念支持跨平臺開發(fā)，但是又更進(jìn)一步：在Flutter中吴超，UI組件和渲染器已經(jīng)從平臺中集成到用戶的應(yīng)用程序中钉嘹，沒有系統(tǒng)UI組件可以操作，所以原來虛擬控件樹的地方現(xiàn)在是真實的控件樹鲸阻。Flutter渲染UI控件樹并將其繪制到平臺畫布上跋涣。這很好缨睡，既簡單又快。 此外陈辱，動畫發(fā)生在用戶空間中奖年，因此應(yīng)用程序（因此開發(fā)人員）可以對其進(jìn)行更多的控制。同時沛贪，從React中借鑒了組件繪制優(yōu)化陋守，可以提供更好的繪制性能。
- 借助可移植的GPU加速的渲染引擎以及高性能本地代碼運行時以達(dá)到跨平臺設(shè)備的高質(zhì)量用戶體驗利赋。flutter使用Skia 2D渲染引擎直接在GDI層面繪制頁面和控件水评，對系統(tǒng)的依賴降低到最低，提供更好的跨平臺兼容性和更高的性能媚送。
2.框架結(jié)構(gòu)
下面的圖片是Flutter框架結(jié)構(gòu)圖中燥，對大部分開發(fā)者而言，最常用的是Widgets層塘偎，屏幕上可見與不可見的元素都由Widgets層實現(xiàn)疗涉，這些元素被稱為Widget。在Widgets層在上層式塌，有兩個現(xiàn)成的Widget庫博敬，Material庫即Material Design的Widget庫，Material Design是Google I/O 2014發(fā)布的設(shè)計語言峰尝，目前成為統(tǒng)一Android Mobile偏窝、Android Table剧防、Desktop Chrome等平臺的設(shè)計語言規(guī)范雹嗦。Cupertino庫則是一個模仿iOS設(shè)計風(fēng)格的Widget庫。
Flutter框架結(jié)構(gòu)圖的底層是Flutter Engine虛擬機(jī)姆泻，在這一層次中需要了解一下的是Skia火窒，Skia是Google研發(fā)的包括圖形硼补、文本、圖像熏矿、動畫等多方面的圖形引擎已骇，不僅用于Google Chrome瀏覽器，Android系統(tǒng)也采用Skia作為繪圖處理引擎票编。
上面的圖片展示了Flutter的繪圖原理褪储，F(xiàn)lutter框架直接使用Skia引擎來渲染，因此能夠控制渲染幀數(shù)慧域，從而實現(xiàn)高幀速率鲤竹。
3.flutter中基本概念
state 狀態(tài)
和React中狀態(tài)概念一致: React 的核心思想是組件化的思想，應(yīng)用由組件搭建而成昔榴，而組件中最重要的概念是State（狀態(tài)）辛藻，State是一個組件的UI數(shù)據(jù)模型碘橘，是組件渲染時的數(shù)據(jù)依據(jù)。flutter程序的運行可以認(rèn)為是一個巨大的狀態(tài)機(jī)吱肌，用戶的操作痘拆，請求API和系統(tǒng)事件的觸發(fā)都是推動狀態(tài)機(jī)運行的Trigger Point，Trigger Point通過調(diào)用setState方法推動狀態(tài)機(jī)進(jìn)行響應(yīng)岩榆。
- 狀態(tài)生命周期
widget 控件
在flutter中错负，一切皆控件！一切皆控件勇边！一切皆控件犹撒！牢牢記住這個概念。Text是控件粒褒，Image是控件识颊，Icon是控件，布局腳手架也是控件奕坟，變換特性也是控件祥款，頁面也是控件，甚至整個APP也是控件月杉。
用戶自定義控件分為有狀態(tài)控件和無狀態(tài)控件兩種類型刃跛。
flutter的內(nèi)置控件分為兩種：
可視控件(visible widget)。即我們直接看到的控件苛萎，如text桨昙、Icon、Button腌歉，名稱理解和html標(biāo)簽相同蛙酪。
布局控件(layout widget)∏谈牵可以理解為架子桂塞，如Row、Column馍驯、Container阁危。布局控件不會直接呈現(xiàn)內(nèi)容，可看作承載可視控件的容器汰瘫。所有的布局控件都有承載子控件的屬性：
child或children狂打。child可承載單個子控件，children可承載多個子控件吟吝。每個布局控件有默認(rèn)的布局方式，使其子控件按照自己的樣式安放到位子上颈娜。布局控件提供了各種樣式的參數(shù)剑逃，可實現(xiàn)子控件的對齊(align)浙宜、縮放(size)、包裝(pack)和嵌套(Nest)蛹磺。簡單總結(jié)為：布局控件是為了實現(xiàn)可視控件的各種視覺效果而做的包裝粟瞬。控件生命周期
