SwiftUI Essentials - SwiftUI 基礎(chǔ)
摘要
這篇文章介紹了?SwiftUI 的基礎(chǔ)使用方法。我主要通過(guò)觀看 WWDC19 的視頻學(xué)習(xí) SwiftUI，我習(xí)慣在看教程的時(shí)候把重要的事項(xiàng)整理為筆記。如果你和我一樣也是 iOS 的開發(fā)者，你一定會(huì)喜歡上 SwiftUI。和復(fù)雜的 UIViewController 說(shuō)再見(jiàn)吧！
SwiftUI 不是為了重新發(fā)明輪子，它包含所有 UIKit 里原有的控件，手勢(shì)控制等，還能更好地適配 iPhone，iPad，Mac，Apple TV?等平臺(tái)。SwiftUI 的出現(xiàn)是為了讓開發(fā)者更加集中精力在自己的定制功能，而不是基本的用戶界面。
Views and Modifiers - 視圖和修飾
View 是用戶界面的基礎(chǔ)，每一個(gè) View 定義了 App 里的一部分 UI。通過(guò)編寫聲明式 View 關(guān)系結(jié)構(gòu)來(lái)完成對(duì)用戶界面的定義。
View Container Syntax - 視圖容器語(yǔ)法
View 容器，以 VStack 為例，容器定義了內(nèi)容里的層級(jí)關(guān)系。VStack 的定義是一個(gè) struct，初始化函數(shù)包括了所有可以自定義的參數(shù)。例如 alignment，spacing。在 swiftUI 里通過(guò) VStack(參數(shù)) 來(lái)初始化，例如：VStack(alignment: .leading)。
Binding Syntax - 綁定語(yǔ)法
View 的 struct 定義中有變量前面標(biāo)記為 @State 的情況，代表這個(gè)變量可以與傳入的變量進(jìn)行綁定。傳入的變量需要在變量名前添加“$”，有點(diǎn)類似 C 代碼里的傳遞指針。詳細(xì)介紹在《Data Flow Through SwiftUI》課程。
Modifier - 修飾
在一個(gè)已有的 View 后面添加 .Modifier(參數(shù))。SwiftUI 里這種語(yǔ)法叫做 Modifier。它的功能是用自定義參數(shù)，從一個(gè)已有的 View 中創(chuàng)建新的 View。
SwiftUI 會(huì)按照 Modifier 的順序把 Modifier 添加到視圖架構(gòu)中，所以 Modifier 添加的順序會(huì)影響 View 最終的樣式。SwiftUI 提倡開發(fā)者用模塊化的 View，每個(gè) View 有自己明確的視圖樣式和功能。
Custom Views - 自定義視圖
通過(guò)編寫類型為 View 的 struct 來(lái)實(shí)現(xiàn)自定義視圖。
struct 中的 var body: some View，定義了自定義視圖中的內(nèi)容。some 是 swift 的語(yǔ)法，表示自動(dòng)推斷返回類型。SwiftUI 鼓勵(lì)多使用自定義視圖，每一個(gè)自定義視圖完成一些基礎(chǔ)的功能和界面，最終把這些自定義視圖組合起來(lái)完成一個(gè)功能強(qiáng)大，視圖復(fù)雜的 App。
Compare with UIKit - 與 UIKit 的對(duì)比
基于 UIKit 開發(fā)的自定義視圖通常是定義一個(gè) class，繼承 UIView；SwiftUI 則是定義 View 類型的 struct。假如我們要修改視圖的某些公共變量，例如 opacity 和 backgroundColor。在 UIKit 中，我們的自定義視圖繼承了 UIView 的所有公共屬性；在 SwiftUI 中，我們通過(guò)給 View 添加 Modifier 來(lái)實(shí)現(xiàn)。這些 Modifier 靈活地遍布在各種 View 中，而不是像 UIKit 那樣繼承全部的 UIView 屬性，從而達(dá)到輕量化，占用更小的存儲(chǔ)空間的效果。
在 SwiftUI 中，View 被定義為一種 protocol。
SwiftUI 提供了一系列原始視圖，這些視圖是視圖的最小單位。例如：Text，Color，Image等等。開發(fā)者可以利用這些原始視圖來(lái)構(gòu)建復(fù)雜精細(xì)的用戶界面。在《Building Custom Views in SwiftUI》課程有關(guān)于自定義視圖的詳細(xì)介紹。
View 的刷新方式
SwiftUI 中的 View 是 struct，所以在生成 View 的時(shí)候是被定義為其輸入的函數(shù)，即初始化函數(shù)。當(dāng)輸入發(fā)生變化時(shí)，SwiftUI 都會(huì)重新調(diào)用 View 的初始化函數(shù)，來(lái)獲取視圖的更新版本。
例如：代碼中的 previousOrders 變量如果在運(yùn)行中改變了，那么 SwiftUI 會(huì)根據(jù)改變的內(nèi)容，自動(dòng)使用改變后的變量來(lái)重新渲染視圖。
Composing Controls 組合控件
像 VStack 那樣，F(xiàn)orm 也是一種視圖容器。Form 容器會(huì)根據(jù)平臺(tái)特性（iOS，macOS）組合容器內(nèi)容的排布方式。
Button 按鈕
按鈕的內(nèi)容可以自由組合，例如：開發(fā)者可以在 Button 里放一個(gè) VStack，制作一個(gè)包含圖片和文字描述的按鈕。
通過(guò)把自定義視圖放進(jìn) NavigationView 容器中實(shí)現(xiàn)導(dǎo)航功能?？梢酝ㄟ^(guò)子視圖的 .navigationBarTitle(Text("Title")) 來(lái)設(shè)置 NavigationView 的標(biāo)題。這個(gè) Modifier 是一種“信息由子視圖流向父視圖”的例子，在子視圖設(shè)置 navigationBarTitle 會(huì)反饋到父視圖的 NavigationView 中?？墒褂?NavigationButton(destination)來(lái)從一個(gè)頁(yè)面導(dǎo)航到另一個(gè)頁(yè)面。
