最近,學習了一些 Flutter
相關的知識,做了如下的小移動應用,當然是一套程式碼即可在 iOS
平臺執行,也可以在 Android
執行。
文章詳情可查閱我的部落格:h.lishaoy.net ,歡迎大家訪問。
下面我將手拉手帶您快速構建出漂亮的移動應用介面(如下?小視訊)
初識 Flutter
Flutter 是谷歌的移動UI框架,可以快速在iOS和Android上構建高質量的原生使用者介面。
Google 推出 Flutter 移動應用框架已經有三年,直到今年的 Google I/O 開發大會才正式介紹 Flutter
且釋出 Beta 版本, Flutter Google I/O 視訊 這個是 Flutter
在油管(YouTube)的 Google I/O 開發者大會的視訊,請自行觀看。
再來看看更加生動的視訊介紹,加速您的初識 Flutter
Google 的廣告應用 Adwords,阿里的閒魚 App 都是基於 Flutter
框架開發的。
以下是阿里巴巴用 Flutter 打造了5000多萬使用者閒魚 App (Flutter Developer Story) 的故事視訊
Flutter
作為谷歌推出的跨平臺開發框架,一經推出便吸引了不少注意,在 GitHub 上的 Star 數已超過 4W+ 。
CMTC全球大前端技術大會 ㄧ Flutter視訊 這是 Google中國在 bilibili 上釋出的視訊,請自行觀看。
Flutter 特性
通過以上的視訊,對於 Flutter
已有所認識,下面再來看看 Flutter
的以下特性
熱過載
當你修改了程式碼 ⌘ - S ,可立刻看到效果,而且可以保持介面狀態不變(如文字框輸入的資訊不會改變),如圖:
設計
Flutter
自帶 Google 推行的設計系統:Material Design ,它提供了豐富的 Material Design 風格的元件(比如:按鈕、輸入框、對話方塊、導航欄、邊欄等),而且也提供了豐富的 iOS(Cupertino) 風格的元件,利用這些風格的元件能夠快速的構建應用,如圖
widget
widget 是 Flutter
應用程式基本構建塊, Flutter
既不使用 WebView,也不使用作業系統的原生控制元件,相反 Flutter
使用自己的高效能渲染引擎來繪製widget , Flutter
的中心思想是用 widget 構建你的 UI(一切皆為 widget) ,如圖是官網給出的框架圖:
在這個架構裡,你可以實現 Flutter
提供的所有現成的 widget ,也可以建立自己定製的 widget ,每個 widget 都是公開的,你可以從高層次且統一的 widget 中獲得開發效率優勢,這個設計的目標是為了用更少的程式碼做更多的事情。
語言
Flutter
使用 C、C ++、Dart 和 Skia(2D渲染引擎)技術構建,如上圖,底層(engine)是用 C ++ ,框架是用 Dart ,當然我們開發使用的也是 Dart。
Dart 是 Google 釋出的一種高效、簡潔、擁有完整型別系統的 結構化的Web程式設計
語言, Flutter
官方給出為什麼選擇 Dart 作為開發語言的原因,如下
- 開發人員的效率
- 物件導向
- 可預測,高效能
- 快速記憶體分配
對於開發者(語言使用者)來說,不必太擔心,Dart 和 Java 、 JavaScript 比較類似,有一些程式語言基礎,便可拿來即用(不清楚的看看語法、關鍵字、型別即可)。
現在想必您對 Flutter
已經有了一定的認識,在之後的篇幅了會手拉手帶你極速構如文頭小視訊的小應用。