第 47 章
如何使用 Preview Macro

SwiftUI 中的預覽(Preview)功能允許開發人員在不運行應用程序於設備或模擬器上的情況下,實時查看App的外觀。這個功能對於那些希望快速迭代設計並確保一切看起來和運作如預期的開發人員來說非常有用。隨著 iOS 17 中引入了巨集(Macro)的功能,預覽功能變得更加強大和靈活,提供了更多的自定義和靈活性。在本教學中,我們將探索如何在 SwiftUI 中使用新的預覽巨集(Preview Macro)以及一些令人興奮的新功能。

新的 #Preview 巨集

在引入新的 #Preview 巨集之前,你需要定義一個遵循 PreviewProvider 協議的 struct 來創建視圖的預覽。以下是一個範例:

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

有了 #Preview 巨集,你可以使用以下程式碼告訴 Xcode 建立預覽:

// The basic syntax
#Preview {
    ContentView()
}

// Configure the preview's name
#Preview("Pie Chart View") {
    PieChartView()
}

正如你所見,#Preview 簡化了我們定義預覽的方式。另外,你也可以向 #Preview 巨集傳遞一個名稱以配置預覽的名稱。

圖 47.1. 預覽基礎
圖 47.1. 預覽基礎

你可以根據需要為任何視圖設置預覽。然後,Xcode將呈現預覽,該預覽將直接顯示在畫布中。

預覽多個視圖

圖 47.2. 預覽多個視圖
圖 47.2. 預覽多個視圖

想更深入學習SwiftUI和下載完整程式碼?你可以從 AppCoda網站購買《精通 SwiftUI》完整電子版。

results matching ""

    No results matching ""