Hacking with iOS: SwiftUI Edition - Word Scramble 项目——List 介绍

Word Scramble

在所有SwiftUI的视图类型中，List将会是您最依赖的一种。这并不意味着您会最常使用它——我确信Text或VStack会获得该称号——更重要的是，您会一次又一次地回到它上面。这并不是什么新鲜事：UIKit中List的等效项是UITableView，它的使用率也很高。

List的工作是提供数据滚动表。实际上，它与Form几乎相同，只是它用于显示数据而不是请求用户输入。不要误会我的意思：您也会经常使用Form，但这实际上只是List的一种特殊类型。

与Form一样，您可以提供List静态视图的选择，以将其呈现在单独的行中：

List {
    Text("Hello World")
    Text("Hello World")
    Text("Hello World")
}

我们还可以切换到ForEach以便从数组或范围动态创建行：

List {
    ForEach(0..<5) {
        Text("Dynamic row \($0)")
    }
}

事情变得更加有趣的是混合静态和动态行的方式：

List {
    Text("Static row 1")
    Text("Static row 2")

    ForEach(0..<5) {
        Text("Dynamic row \($0)")
    }

    Text("Static row 3")
    Text("Static row 4")
}

当然，我们可以将其与Section结合起来，以使我们的列表更易于阅读：

List {
    Section(header: Text("Section 1")) {
        Text("Static row 1")
        Text("Static row 2")
    }

    Section(header: Text("Section 2")) {
        ForEach(0..<5) {
            Text("Dynamic row \($0)")
        }
    }

    Section(header: Text("Section 3")) {
        Text("Static row 3")
        Text("Static row 4")
    }
}

能够同时拥有静态和动态内容，使我们可以像在Apple的``设置''应用中重新连接Wi-Fi界面那样——启用全系统Wi-Fi的开关是静态的，然后是附近的网络是动态列表，然后是更多的静态单元格，如自动加入热点等。

您会注意到，该列表看起来与我们以前的表单有很大不同，但是实际上，您看到的只是iOS上的表格视图样式不同。我们可以使用listStyle（）修饰符获得类似的外观，如下所示：

.listStyle(GroupedListStyle())

现在，到目前为止，您所看到的所有内容都可以与Form以及List一起使用——甚至是动态内容。但是有一个是List能做到而Form不能做的就是完全从动态内容生成行，而无需ForEach。

因此，如果您的整个列表由动态行组成，则只需编写以下代码：

List(0..<5) {
    Text("Dynamic row \($0)")
}

这使我们能够非常快速地创建列表，考虑到列表的普遍性，这很有用。

在本项目中，我们使用List将稍有不同，因为我们将使其遍历字符串数组。我们已经使用了很多范围的ForEach，无论是硬编码（0 .. <5）还是依赖于可变数据（0 .. ，它的效果都很好，因为SwiftUI可以根据行的唯一标识每一行范围内的位置。

当处理一组数据时，SwiftUI仍然需要知道如何唯一地标识每一行，因此，如果删除了一行，则可以简单地删除该行，而不必重新绘制整个列表。这是id参数出现的地方，它在List和ForEach中的工作原理都相同——它使我们能够确切地告诉SwiftUI是什么使数组中的每个项目变得唯一可标识。

当使用字符串和数字数组时，使这些值唯一的是值本身。也就是说，如果我们有数组[2、4、6、8、10]，那么这些数字本身就是唯一的标识符。毕竟，我们没有其他需要使用的东西！

当使用这种列表数据时，我们使用id：\ .self像下面这样：

struct ContentView: View {
    let people = ["Finn", "Leia", "Luke", "Rey"]

    var body: some View {
        List(people, id: \.self) {
            Text($0)
        }
    }
}

这与ForEach相同，因此，如果我们想混合使用静态和动态行，则可以这样写：

List {
    Text("静态行")
    ForEach(people, id: \.self) {
        Text($0)
    }
}

译自 Introducing List, your best friend

Previous: BetterRest 项目——挑战	Hacking with iOS: SwiftUI Edition	Next: Word Scramble 项目——从App Bundle中加载资源文件

赏我一个赞吧~~~