Flutter核心原則是什么

這篇文章主要介紹“Flutter核心原則是什么”，在日常操作中，相信很多人在Flutter核心原則是什么問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對(duì)大家解答”Flutter核心原則是什么”的疑惑有所幫助！接下來，請(qǐng)跟著小編一起來學(xué)習(xí)吧！

1. Flutter 是什么？

Flutter 是 Google 開源的 UI 工具包，幫助開發(fā)者通過一套代碼庫高效構(gòu)建多平臺(tái)精美應(yīng)用，支持移動(dòng)、Web ([early access][])、桌面和嵌入式平臺(tái)。

Flutter 旨在幫助開發(fā)者創(chuàng)作媲美原生的高性能應(yīng)用，并遵從了各個(gè)平臺(tái)不同的滾動(dòng)行為、排版布局、圖標(biāo)樣式等。

這是一個(gè)名為 Gallery 的示例應(yīng)用， Gallery 是一個(gè)在安裝完 Flutter 并配置好環(huán)境后可以立即運(yùn)行的 Flutter 示例應(yīng)用集合。Shrine 有高質(zhì)量的滾動(dòng)圖片、交互式卡片、按鈕、下拉列表以及一個(gè)購物車頁面。

開始開發(fā)之前無需移動(dòng)開發(fā)經(jīng)驗(yàn)。應(yīng)用使用 Dart 開發(fā)，如果你曾使用過 Java 或者 JavaScript 語言，那么 Dart 看上去會(huì)很熟悉。面向?qū)ο缶幊痰慕?jīng)驗(yàn)對(duì)開發(fā)毫無疑問會(huì)有幫助，但即便不是程序員也可以制作 Flutter 應(yīng)用！

2. 為什么使用 Flutter？

Flutter 的優(yōu)勢(shì)是什么？它能夠幫你：

• 高效率

• 在應(yīng)用運(yùn)行時(shí)嘗試修改代碼并重載（通過熱重載）

• 修復(fù)崩潰并從應(yīng)用停止的地方開始繼續(xù)調(diào)試

• 利用單一代碼庫開發(fā) iOS 與 Android 應(yīng)用

• 即便在單一操作系統(tǒng)上，也可以通過使用現(xiàn)代、富有表現(xiàn)力的語言以及聲明式方法，寫更少代碼做更多事

• 原型與輕松迭代

• 生成美觀、高度定制化的用戶體驗(yàn)

• 受益于用 Flutter 框架構(gòu)建的豐富的 Material Design 以及 Cupertino （iOS 風(fēng)格） widget

• 實(shí)現(xiàn)定制、美觀、品牌驅(qū)動(dòng)的設(shè)計(jì)，不受 OEM widget 集合的限制

3. 核心原則

Flutter 包含一個(gè)現(xiàn)代響應(yīng)式框架，一個(gè) 2D 渲染引擎，現(xiàn)成的 widget 以及開發(fā)工具。這些組件協(xié)同工作以幫助你設(shè)計(jì)、構(gòu)建、測(cè)試和調(diào)試應(yīng)用。所有這一切都圍繞幾個(gè)核心原則進(jìn)行組織。

3.1 一切皆 Widget

Widget 是 Flutter 應(yīng)用用戶界面的基本構(gòu)建單元，每個(gè) widget 都與最終的用戶界面的展示緊密相關(guān)。不同于其他框架和平臺(tái) —— 將視圖 (views)、視圖控制器 (view controllers)、布局 (layouts) 等其他屬性分開， Flutter 擁有統(tǒng)一的對(duì)象模型：widget。

一個(gè) widget 可以定義：

• 一個(gè)結(jié)構(gòu)元素（比如一個(gè)按鈕或者菜單）

• 一個(gè)風(fēng)格元素（比如一個(gè)字體或者配色方案）

• 布局的一個(gè)方面（比如 padding）

• 等等……

Widget 通過組合形成一個(gè)層次結(jié)構(gòu)，每個(gè) widget 嵌套其中，從其父節(jié)點(diǎn)繼承屬性。Flutter 中沒有單獨(dú)的“application”對(duì)象，與之相對(duì)應(yīng)的功能由 root widgets 承擔(dān)。

你可以通過告訴框架將層次結(jié)構(gòu)中的一個(gè) widget 替換為另一個(gè)來響應(yīng)事件，如用戶交互?？蚣軐?huì)對(duì)比新舊 widget 并及時(shí)更新用戶界面。

3.1.1 組合大于繼承

Widgets 本身往往是由許多小的、具有單一用途的 widget 組成，它們組合在一起可以產(chǎn)生強(qiáng)大的效果。比如，Container 是一個(gè)常用的 widget，由負(fù)責(zé)布局、繪制、定位和尺寸的幾個(gè) widget 組成。具體來說，Container 是由 LimitedBox、ConstrainedBox、Align、Padding、 DecoratedBox 和 Transform widgets 組成的。你可以將這些與其它小而簡單的 widgets 用新穎的方式組合，而不是子類化 Container 以生成自定義效果。

類層次結(jié)構(gòu)是淺而廣的，以支持盡可能多的組合。

你也可以通過組合其它 widgets 以達(dá)到控制一個(gè) widget 的布局。例如，為了居中一個(gè) widget，你可以把它包裹在一個(gè) Center widget 中。還有用于設(shè)置間距、對(duì)齊、行、列以及網(wǎng)格的 widgets，這些布局 widgets 本身并沒有視覺表現(xiàn)。反之，他們唯一的目的是在某些方面上控制另一個(gè) widget 的布局。要了解一個(gè) widget 以某種方式呈現(xiàn)的原因，查看其鄰近 widgets 通常很有幫助。

3.1.2 層次蛋糕非常美味

Flutter 框架由一系列層結(jié)構(gòu)組成，每一層都建立在前一層之上。

框架上層會(huì)比下層使用的更頻繁。有關(guān)組成 Flutter 層次框架的完整庫集可以參閱我們的 API 文檔。

這樣做的目的是為了幫助你用更少的代碼完成更多工作。例如，通過在 widgets 層組合基礎(chǔ) widgets 來構(gòu)建 Material 層，而 widgets 層本身則是通過對(duì)來自 Rendering 層的低層次對(duì)象組合而來。

這些層次為構(gòu)建應(yīng)用程序提供了許多選項(xiàng)。選擇一種自定義方法來釋放框架的全部表現(xiàn)力，或使用 widgets 層中的構(gòu)建塊，或混合搭配。你可以組合 Flutter 提供的現(xiàn)成 widgets 或使用 Flutter 團(tuán)隊(duì)在構(gòu)建框架時(shí)所使用的相同工具和技術(shù)來構(gòu)建你的自定義 widgets。

沒有任何內(nèi)容可以逃離你的視線，因此可以在生產(chǎn)力上從高級(jí)別、統(tǒng)一的 widget 概念中獲益，且不會(huì)犧牲你想深入更底層時(shí)的能力。

3.2 構(gòu)建 widget

你可以通過完善 build() 函數(shù)來定義一個(gè) widget 擁有的特性，該函數(shù)返回一個(gè) widget 樹（或者層次結(jié)構(gòu)）。該樹通過更具體的方式來表示用戶界面上的 widget 部分。例如，一個(gè) toolbar widget 可能會(huì)有一個(gè)返回一些 水平布局 文本 和 各種 按鈕 的構(gòu)建函數(shù)。框架會(huì)遞歸地去構(gòu)建這些 widget 直到達(dá)到最底層 完全具象的 widgets，然后將它們拼接成一棵樹。

一個(gè) widget 的構(gòu)建函數(shù)應(yīng)該沒有副作用。不論何時(shí)調(diào)用，widget 總應(yīng)該返回一顆新的 widgets 樹，不論其之前返回了什么。框架會(huì)將先前構(gòu)建與當(dāng)前構(gòu)建仔細(xì)進(jìn)行比較，并確定需要對(duì)用戶界面做哪些修改。

這種自動(dòng)比較非常有效，可實(shí)現(xiàn)高性能的交互式應(yīng)用。構(gòu)建函數(shù)在設(shè)計(jì)上通過專注聲明 widget 的構(gòu)成，而不是處理更新用戶界面狀態(tài)的復(fù)雜性，來達(dá)到簡化代碼的目的。

3.3 處理用戶交互

如果一個(gè) widget 的特性需要根據(jù)用戶交互或其他因素改變，那么這個(gè) widget 是有狀態(tài)的。例如，如果一個(gè) widget 包含一個(gè)隨用戶點(diǎn)擊按鈕而遞增的計(jì)數(shù)器，則計(jì)數(shù)器的值便是 widget 的狀態(tài)。當(dāng)該值更改時(shí)，則需要重新構(gòu)建 widget 以更新 UI。

這些 widget 繼承自 StatefulWidget（而不是 StatelessWidget）并將它們可變的狀態(tài)存儲(chǔ)在 State 的一個(gè)子類中。

不論何時(shí)你操作一個(gè) State 對(duì)象（例如，遞增計(jì)數(shù)器），你必須調(diào)用 setState() 方法來通知框架通過重新調(diào)用 State 的構(gòu)建函數(shù)，以此達(dá)到更新用戶界面的目的。有關(guān)狀態(tài)管理的示例，可以查看隨著任何一個(gè)新 Flutter 項(xiàng)目生成的 MyApp 模版。

將狀態(tài)與 widgets 對(duì)象分開可以讓其他 widgets 以相同的方式處理無狀態(tài)和有狀態(tài)的 widget，而不用擔(dān)心丟失狀態(tài)。不同于通過維持一個(gè)子節(jié)點(diǎn)來保留狀態(tài)，父節(jié)點(diǎn)可以自由地創(chuàng)建子節(jié)點(diǎn)實(shí)例，而不會(huì)丟失子節(jié)點(diǎn)的持久狀態(tài)?？蚣軙?huì)在適當(dāng)?shù)臅r(shí)候做完查找和重用現(xiàn)有狀態(tài)對(duì)象的所有工作。

到此，關(guān)于“Flutter核心原則是什么”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí)，請(qǐng)繼續(xù)關(guān)注億速云網(wǎng)站，小編會(huì)繼續(xù)努力為大家?guī)砀鄬?shí)用的文章！