1.1 Flutter是什么
1.1.1 Flutter簡介
Flutter是谷歌的移動(dòng)UI框架，可以快速在iOS和Android上構(gòu)建高質(zhì)量的原生用戶界面渐行，一份代碼可以同時(shí)生成iOS和Android兩個(gè)高性能弛针、高保真的應(yīng)用程序叠骑。Flutter目標(biāo)是使開發(fā)人員能夠交付在不同平臺(tái)上都感覺自然流暢的高性能應(yīng)用程序，并且兼容滾動(dòng)行為削茁、排版宙枷、圖標(biāo)等方面的差異掉房。flutter的開發(fā)語言是Dart，如果您使用過Java或JavaScript之類的語言慰丛，則能夠很快上手卓囚，甚至有一些Flutter應(yīng)用是沒有編程經(jīng)驗(yàn)的人寫的！在全世界诅病，F(xiàn)lutter正在被越來越多的開發(fā)者和組織使用哪亿，并且Flutter是完全免費(fèi)、開源的贤笆。
跨平臺(tái)自繪引擎
Flutter與其它大多數(shù)跨平臺(tái)框架不同锣夹，因?yàn)镕lutter既不使用WebView，也不使用操作系統(tǒng)的原生控件苏潜。 相反银萍，F(xiàn)lutter使用自己的高性能渲染引擎來繪制widget。這樣不僅可以保證在Android和iOS上UI的一致性恤左，而且也可以避免對原生控件依賴而帶來的限制及高昂的維護(hù)成本贴唇。
Flutter使用Skia作為其2D渲染引擎，Skia是一個(gè) 2D的繪圖引擎庫飞袋，其前身是一個(gè)向量繪圖軟件戳气，Chrome和 Android均采用 Skia作為繪圖引擎。Skia提供了非常友好的 API巧鸭，并且在圖形轉(zhuǎn)換瓶您、文字渲染、位圖渲染方面都提供了友好纲仍、高效的表現(xiàn)呀袱。Skia是跨平臺(tái)的，所以可以被嵌入到 Flutter的 iOS SDK中郑叠，而不用去研究 iOS閉源的 Core Graphics / Core Animation夜赵。
目前Flutter默認(rèn)支持iOS、Android乡革、Fuchsia（Google新的自研操作系統(tǒng)）三個(gè)移動(dòng)平臺(tái)寇僧。但Flutter亦可支持Web開發(fā)（Flutter for web）和PC開發(fā)，本書的示例和介紹主要是基于iOS和Android平臺(tái)的沸版，其它平臺(tái)讀者可以自行了解嘁傀。
Flutter的優(yōu)勢
開發(fā)效率高
毫秒級的熱重載，修改后视粮，您的應(yīng)用界面會(huì)立即更新细办。使用豐富的、完全可定制的widget在幾分鐘內(nèi)構(gòu)建原生界面馒铃。富有表現(xiàn)力和靈活的UI
快速發(fā)布聚焦于原生體驗(yàn)的功能蟹腾。分層的架構(gòu)允許您完全自定義痕惋，從而實(shí)現(xiàn)難以置信的快速渲染和富有表現(xiàn)力、靈活的設(shè)計(jì)娃殖。原生性能
Flutter包含了許多核心的widget值戳，如滾動(dòng)、導(dǎo)航炉爆、圖標(biāo)和字體等堕虹，這些都可以在iOS和Android上達(dá)到原生應(yīng)用一樣的性能。
Flutter的開發(fā)語言
Flutter采用的是Dart作為開發(fā)框架和widget的語言芬首。
為什么選擇Dart語言赴捞？
Flutter在四個(gè)主要維度進(jìn)行了評估，并考慮了框架作者郁稍、開發(fā)人員和最終用戶的需求等因素赦政。我們發(fā)現(xiàn)不同的語言在不同的層面符合一部分需求，但Dart在所有評估維度上得分都很高耀怜，并且符合我們的所有要求和標(biāo)準(zhǔn)恢着。
Dart運(yùn)行時(shí)和編譯器支持Flutter的兩個(gè)關(guān)鍵特性的組合：
基于JIT的快速開發(fā)周期：允許使用類型的語言進(jìn)行形狀更改和有狀態(tài)的熱重載；
AOT編譯器财破，可生成高效的ARM代碼掰派，可以快速啟動(dòng)并擁有可預(yù)測的生產(chǎn)部署性能。
此外左痢，flutter開發(fā)團(tuán)隊(duì)與Dart社區(qū)密切合作靡羡，Dart社區(qū)正在積極投入資源改進(jìn)Dart在Flutter中的使用。例如俊性，當(dāng)我們采用Dart時(shí)略步，該語言沒有提供生成原生二進(jìn)制文件的工具鏈（這對于實(shí)現(xiàn)可預(yù)測的高性能是很有幫助的），但是現(xiàn)在實(shí)現(xiàn)了磅废，因?yàn)镈art團(tuán)隊(duì)為Flutter構(gòu)建了它纳像。同樣荆烈，DartVM之前已經(jīng)針對吞吐量進(jìn)行了優(yōu)化拯勉，但團(tuán)隊(duì)現(xiàn)在正在優(yōu)化VM的延遲時(shí)間，這對于Flutter的工作負(fù)載更為重要憔购。
Dart在以下主要標(biāo)準(zhǔn)上得到高分：
開發(fā)人員的效率 Flutter的主要價(jià)值主張之一是通過讓開發(fā)人員使用相同的代碼庫為iOS和Android創(chuàng)建應(yīng)用程序宫峦，從而節(jié)省了工程資源。使用高效的語言可以進(jìn)一步加速開發(fā)周期玫鸟，并使Flutter更具吸引力导绷。這對我們的framework團(tuán)隊(duì)和開發(fā)人員都非常重要。大部分Flutter功能都是用Dart實(shí)現(xiàn)屎飘，因此我們需要在10萬行代碼時(shí)能保持高效的而不會(huì)犧牲framework和widget的可讀性妥曲。
面向?qū)ο?/strong>雖然我們可以使用非面向?qū)ο蟮恼Z言贾费，但這意味著要重新解決幾個(gè)難題。另外檐盟，絕大多數(shù)開發(fā)人員都具有面向?qū)ο箝_發(fā)的經(jīng)驗(yàn)褂萧，因此更容易學(xué)習(xí)如何使用Flutter進(jìn)行開發(fā)。
可預(yù)測葵萎，高性导犹。借助Flutter，我們希望使開發(fā)人員能夠快速創(chuàng)建流暢的用戶體驗(yàn)羡忘。為了實(shí)現(xiàn)這一點(diǎn)谎痢，我們需要能夠在每個(gè)動(dòng)畫幀中運(yùn)行大量的代碼。這意味著我們需要一種既能提供高性能又能提供可預(yù)測性能的語言卷雕，而不會(huì)出現(xiàn)會(huì)導(dǎo)致丟幀的周期性暫停节猿。
快速內(nèi)存分配 Flutter框架使用函數(shù)式流，它很大程度上依賴于底層的內(nèi)存分配器漫雕，從而有效地處理小的沐批、短期的內(nèi)存分配會(huì)非常重要，所以在缺乏此功能的語言中Flutter無法有效地工作蝎亚。
1.1.2 Flutter框架結(jié)構(gòu)
Flutter框架是一個(gè)分層的結(jié)構(gòu)九孩，每個(gè)層都建立在前一層之上。
這個(gè)設(shè)計(jì)的目標(biāo)是幫助你用更少的代碼做更多的事情发框。例如躺彬，Material層是通過組合來自Widget層的基本W(wǎng)idget來構(gòu)建的， 并且Widgets層本身是通過較低級對象渲染層構(gòu)建的梅惯。
層為構(gòu)建應(yīng)用程序提供了許多選項(xiàng)宪拥。選擇一種自定義的方法來釋放框架的全部表現(xiàn)力，或者使用構(gòu)件層中的構(gòu)建塊铣减，或混合搭配她君。 您可以實(shí)現(xiàn)Flutter提供的所有現(xiàn)成的widget，或者使用Flutter團(tuán)隊(duì)用于構(gòu)建框架的相同工具和技術(shù)創(chuàng)建您自己的定制widget葫哗。
沒有什么是隱藏的缔刹。您可以從高層次，統(tǒng)一的widget概念中獲得開發(fā)效率優(yōu)勢劣针，而不會(huì)犧牲您希望深入到下層的能力校镐。
Flutter框架分三層 Framework，Engine捺典， Embedder
Flutter Framework
Framework使用dart語言實(shí)現(xiàn)鸟廓，包括UI，文本，圖片引谜，按鈕等Widgets牍陌，渲染，動(dòng)畫员咽，手勢等呐赡。此部分的核心代碼是flutter倉庫下的flutter package，以及sky_engine倉庫下的 io, async, ui(dart:ui庫提供了Flutter框架和引擎之間的接口)等package骏融。
Flutter Engine
Engine使用C++實(shí)現(xiàn)链嘀，主要包括:Skia, Dart 和 Text。
- Skia是開源的二維圖形庫档玻，提供了適用于多種軟硬件平臺(tái)的通用API怀泊。其已作為Google Chrome，Chrome OS误趴，Android, Mozilla Firefox, Firefox OS等其他眾多產(chǎn)品的圖形引擎霹琼，支持平臺(tái)還包括Windows, macOS, iOS，Android凉当，Ubuntu等枣申。
- Dart 部分主要包括:Dart Runtime，Garbage Collection(GC)看杭，如果是Debug模式的話忠藤，還包括JIT(Just In Time)支持。Release和Profile模式下楼雹，是AOT(Ahead Of Time)編譯成了原生的arm代碼模孩，并不存在JIT部分。
- Text 即文本渲染贮缅，其渲染層次如下:衍生自 Minikin的libtxt庫(用于字體選擇榨咐，分隔行)；HartBuzz用于字形選擇和成型谴供；Skia作為渲染/GPU后端块茁，在Android和Fuchsia上使用FreeType渲染，在iOS上使用CoreGraphics來渲染字體桂肌。
Embedder
Embedder是一個(gè)嵌入層数焊，通過該層把Flutter嵌入到各個(gè)平臺(tái)上去，Embedder的主要工作包括渲染Surface設(shè)置, 線程設(shè)置轴或，以及插件等昌跌。平臺(tái)(如iOS)只是提供一個(gè)畫布，剩余的所有渲染相關(guān)的邏輯都在Flutter內(nèi)部照雁，這就使得它具有了很好的跨端一致性。
總結(jié)
Flutter框架本身有著良好的分層設(shè)計(jì)，本節(jié)旨在讓讀者對Flutter整體框架有個(gè)大概的印象饺蚊，相信到現(xiàn)在為止萍诱，讀者已經(jīng)對Flutter有一個(gè)初始印象，在我們正式動(dòng)手之前污呼，我們還需要了解一下Flutter的開發(fā)語言Dart裕坊。
1.1.3 如何學(xué)習(xí)Flutter
本節(jié)給大家一些學(xué)習(xí)建議，分享一下筆者在學(xué)習(xí)Flutter中的一些心得燕酷，希望可以幫助你提高學(xué)習(xí)效率籍凝，避免不必要的坑。
資源
- 官網(wǎng)：閱讀Flutter官網(wǎng)的資源是快速入門的最佳方式苗缩，同時(shí)官網(wǎng)也是了解最新Flutter發(fā)展動(dòng)態(tài)的地方饵蒂，由于目前Flutter仍然處于快速發(fā)展階段，所以建議讀者還是時(shí)不時(shí)的去官網(wǎng)看看有沒有新的動(dòng)態(tài)酱讶。
- 源碼及注釋：源碼注釋應(yīng)作為學(xué)習(xí)Flutter的第一文檔退盯，F(xiàn)lutter SDK的源碼是開源的，并且注釋非常詳細(xì)泻肯，也有很多示例渊迁，實(shí)際上，F(xiàn)lutter官方的SDK文檔就是通過注釋生成的灶挟。源碼結(jié)合注釋可以幫你解決大多數(shù)問題琉朽。
- Github：如果遇到的問題在StackOverflow上也沒有找到答案，可以去github flutter 項(xiàng)目下提issue稚铣。
- Gallery源碼：Gallery是Flutter官方示例APP漓骚，里面有豐富的示例，讀者可以在網(wǎng)上下載安裝榛泛。Gallery的源碼在Flutter源碼“examples”目錄下蝌蹂。
社區(qū)
- StackOverflow：如果你還沒聽過StackOverflow，這是目前全球最大的程序員問答社區(qū)曹锨，現(xiàn)在也是活躍度最高的Flutter問答社區(qū)孤个。StackOverflow上面除了世界各地的Flutter使用者會(huì)在上面交流之外，F(xiàn)lutter開發(fā)團(tuán)隊(duì)的成員也經(jīng)常會(huì)在上面回答問題沛简。
- 博客：隨著Flutter技術(shù)的推廣齐鲤，相信很快網(wǎng)上將會(huì)有很多Flutter相關(guān)的文章、博客椒楣，讀者可以多去瀏覽给郊、閱讀。
總結(jié)
有了資料和社區(qū)后捧灰，對于我們學(xué)習(xí)者自身來說淆九，最重要的還是要多動(dòng)手、多實(shí)踐，在本書后面的章節(jié)中炭庙，希望讀者能夠親自動(dòng)手寫一下示例饲窿。準(zhǔn)備好了嗎，下一章中焕蹄，我們將正式進(jìn)入Flutter的世界逾雄！
