遍历

本课属于 Coddy Swift 学习旅程的“SwiftUI 入门”单元。第 29 课，共 50 课。

ForEach 会为集合中的每个元素创建一个视图：

let fruits = ["Apple", "Banana", "Cherry"]

var body: some View {
    VStack {
        ForEach(fruits, id: \.self) { fruit in
            Text(fruit)
        }
    }
}

闭包会接收每个元素，并返回对应的视图。SwiftUI 需要一种区分各行的方式，因此会要求提供一个 id。id: \.self 使用值本身作为标识，这在每个元素都不同时适用。

数字范围也可以，不需要 id：

ForEach(1..<4) { number in
    Text("Row \(number)")
}

这会显示 Row 1、Row 2 和 Row 3：1..<4 会在 4 之前停止。

挑战

简单

显示菜单：在 VStack 中，使用 ForEach 按顺序为 drinks 中的每种饮品创建一个 Text。

亲手试试

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

自我测试

这节课包含一个小测验。开始学习即可作答，并记录你的进度。

SwiftUI 入门中的所有课

1简介

什么是 SwiftUI 应用文件

4修饰符

内边距背景修饰符顺序框架与形状回顾：徽章制作器

7列表

遍历可识别的项目列表添加项目回顾：购物清单

10项目：Coddy 咖啡馆

2显示内容

文本视图文本中的数字字体颜色 SF Symbols 回顾：价格标签

5状态与按钮

按钮 @State 属性真或假状态条件视图回顾：计分器

8导航

NavigationStack NavigationLink 传递数据工作表与警告框回顾：植物指南

11最终挑战

小费计算器待办事项列表判断真假游戏

3堆栈与布局

VStack HStack 对齐与间距 Spacer 与 ZStack 回顾：天气卡片

6用户输入

文本框切换开关步进器和滑块选择器回顾：订单表单

9共享数据

@Binding 属性可观察对象环境对象回顾：步数计数器

自己练习： SwiftUI 在线编辑器