ViewBuilder

ViewBuilder 是 SwiftUI 中用于声明式构建视图层级的核心机制，它通过结果构建器（Result Builder）技术，将多个视图组合成一个视图树。以下是 ViewBuilder 的详细用法和关键特性：

核心概念 #

作用：简化视图组合的语法，支持条件判断、循环、多视图拼接等逻辑。
隐式使用：SwiftUI 的容器（如 VStack、Group）和视图的 body 属性默认使用 ViewBuilder。
显式使用：在自定义视图中，通过 @ViewBuilder 修饰属性或函数参数，实现灵活组合。

基本用法 #

1. 定义 `body` 属性 #

SwiftUI 的 View 协议要求 body 返回 some View，隐式使用 ViewBuilder：

struct MyView: View {
    var body: some View { // 隐式使用 ViewBuilder
        Text("Hello")
        Image(systemName: "star")
    }
}

2. 自定义视图组合 #

通过 @ViewBuilder 修饰自定义视图的属性或函数：

struct CustomContainer<Content: View>: View {
    @ViewBuilder let content: Content
    
    var body: some View {
        VStack(spacing: 10) {
            content
        }
    }
}

// 使用
CustomContainer {
    Text("Item 1")
    Button("Tap Me") { /* ... */ }
}

支持的条件逻辑 #

`if` / `else` 条件 #

根据条件动态显示不同视图：

@ViewBuilder
func conditionalView(isTrue: Bool) -> some View {
    if isTrue {
        Text("True")
    } else {
        Image(systemName: "xmark")
    }
}

`switch` 分支 #

@ViewBuilder
func switchView(type: MyType) -> some View {
    switch type {
    case .image:
        Image("example")
    case .text:
        Text("Example")
    }
}

`if let` 解包可选值 #

@ViewBuilder
func optionalView(value: String?) -> some View {
    if let value = value {
        Text(value)
    } else {
        ProgressView()
    }
}

循环与动态内容 #

配合 `ForEach` #

直接在 ViewBuilder 中使用 ForEach 生成动态视图：

VStack {
    ForEach(1...5, id: \.self) { i in
        Text("Item \(i)")
    }
}

高级用法 #

混合静态和动态视图 #

@ViewBuilder
func mixedContent(items: [String]) -> some View {
    Text("Header")
    ForEach(items, id: \.self) { item in
        Text(item)
    }
    if items.isEmpty {
        Text("No Data")
    }
}

组合多个 ViewBuilder #

将多个 @ViewBuilder 函数组合：

struct ParentView: View {
    var body: some View {
        VStack {
            header()
            bodyContent()
        }
    }
    
    @ViewBuilder
    func header() -> some View {
        Text("Title")
            .font(.title)
    }
    
    @ViewBuilder
    func bodyContent() -> some View {
        // ...
    }
}

注意事项 #

所有分支必须返回视图：
条件逻辑中的每个分支（如 if/else）必须返回 View 类型，否则编译报错。
```
// 错误示例：缺少 else 分支
if condition {
    Text("Yes")
} // 编译错误
```
不支持普通 for 循环：
必须使用 ForEach 替代 for-in 循环，因为 ViewBuilder 无法直接处理动态数量的视图。

视图类型一致性：
所有分支返回的视图类型可以不同，但必须符合 View 协议。

@ViewBuilder
func mixedTypeView() -> some View {
    if Bool.random() {
        Text("Text")
    } else {
        Color.red // 类型为 Color，但符合 View
    }
}

性能优化：
避免在 ViewBuilder 中执行复杂计算，应在视图外部处理数据。

自定义结果构建器 #

虽然 SwiftUI 的 ViewBuilder 已满足大部分需求，但可以自定义结果构建器（高级用法）：

@resultBuilder
struct MyViewBuilder {
    static func buildBlock(_ components: View...) -> some View {
        VStack { // 自定义组合逻辑
            ForEach(0..<components.count, id: \.self) { i in
                components[i]
            }
        }
    }
}

// 使用自定义构建器
struct CustomView {
    @MyViewBuilder var content: () -> some View

    init(@MyViewBuilder content: @escaping () -> some View) {
        self.content = content
    }
}

对比普通函数 #

普通函数无法直接返回多个视图：

// 错误：函数不能返回多个视图
func invalidView() -> some View {
    Text("A")
    Text("B") // 编译错误
}

// 正确：使用 @ViewBuilder
@ViewBuilder
func validView() -> some View {
    Text("A")
    Text("B")
}

总结 #

ViewBuilder 是 SwiftUI 声明式编程的核心，它通过简洁的语法支持：

多视图组合：无需手动包装成 Group 或 TupleView。
动态逻辑：直接嵌入条件判断和循环。
代码复用：创建可组合的视图组件。

掌握 ViewBuilder 能显著提升 SwiftUI 开发效率，尤其在构建复杂界面时，代码更清晰、更易维护。