WWDC19 蘋果宣布全新 UI 框架 SwiftUI

2019 年 WWDC 大會上，蘋果在壓軸環節向大眾宣布了基於 Swift 語言構建的全新 UI 框架 —— SwiftUI。開發者可通過它快速為所有的 Apple 平台創建美觀、動態的應用程序。

在介紹過程中，蘋果公司軟體工程高級副總裁 Craig Federighi 演示了如何將一百行代碼簡化為大約十幾行。

據官方介紹，SwiftUI 是一個創新且非常方便使用的框架，開發者通過 Swift 語言的強大功能即可為蘋果的所有硬體設備構建用戶界面 —— 只需使用一套工具和 API。

此外，SwiftUI 使用了聲明式的 Swift 語法，可讀性比較高，編寫起來也比較容易理解。SwiftUI 可與新的 Xcode 設計工具無縫協作，讓代碼和設計完美同步，還提供對動態類型、暗黑模式、本地化和可訪問性的自動支持。

下面簡單介紹一下 SwiftUI。

聲明式語法

SwiftUI 使用了聲明式語法，所以開發者能夠十分輕易地描述用戶界面應該做什麼。例如，編寫需要包含文本欄位的項目列表時，開發者可以用代碼描述每個欄位的對齊方式、字體和顏色。代碼也比以前更簡單，更易於閱讀。

這種聲明式風格非常適用於像動畫這樣複雜的元素。通過 SwiftUI，開發者可輕鬆地將動畫添加到幾乎任何控制項。

擁有更直觀的新設計工具

Xcode 11 包含更直觀的新設計工具，可讓開發者通過拖拽的方式使用 SwiftUI 構建界面，在這過程中可以直接設置控制項的相關屬性。

當在設計工具中工作時，所編輯的內容會立刻反映到代碼上，如果從模擬器切換到手機，手機也能立馬看到預覽效果。

為所有的蘋果設備提供原生體驗

SwiftUI 是真正的原生 UI 框架，建立在蘋果數十年打磨用戶界面的經驗上。開發者通過少量代碼和互動式設計就能使用這個框架。

SwiftUI 示例代碼

聲明布局

List(landmarks) { landmark in
   HStack {
      Image(landmark.thumbnail)
      Text(landmark.name)
      Spacer()
      
      if landmark.isFavorite {
         Image(systemName: "star.fill")
            .foregroundColor(.yellow)
      }
   }
}

構建可復用的組件

struct FeatureCard: View {
   var landmark: Landmark
   
   var body: some View {
      landmark.featureImage
         .resizable()
         .aspectRatio(3/2, contentMode: .fit)
         .overlay(TextOverlay(landmark))
   }
}

簡便的動畫創建方式

VStack {
   Badge()
      .frame(width: 300, height: 300)
      .animation(.basic())
   Text(name)
      .font(.title)
      .animation(Animation.basic().delay(0.25))
}

SwiftUI 支持的設備要求版本較高，將在7月份開啟公測，官方介紹如下：

iOS 13.0+ Beta
macOS 10.15+ Beta
UIKit for Mac 13.0+ Beta
tvOS 13.0+ Beta
watchOS 6.0+ Beta

SwiftUI 文檔地址 | SwiftUI 官方教程