SwiftUI 简明教程之OutlineGroup、DiclosureGroupView

本文为 eul 样章，如果您喜欢，请移步 appstore/eul 查看更多内容。

eul 是一款 swiftui & combine 教程 app（ios、macos），以文章（文字、图片、代码）配合真机示例（xcode 12+、ios 14+，macos 11+）的形式呈现给读者。笔者意在尽可能使用简洁明了的语言阐述 swiftui & combine 相关的知识，使读者能快速掌握并在 ios 开发中实践。

outlinegroup

outlinegroup 与前面章节提到的可展开列表类似，只是它的使用范围更广，我们不一定要在 list 中才能实现可展开功能。在任何一个 view 中，我们都可以用 outlinegroup 实现可展开功能。

同样以前面提到的树形结构的 weathers 为例：

outlinegroup(expandweather, children: \.weathers) { weather in
  label(weather.name, systemimage: weather.icon)
}

这和之前 list 的使用方法几乎一模一样。

diclosuregroupview

diclosuregroupview 同样可以实现树形结构的展开/收拢，它使用起来更灵活，我们不必使用树形结构的数据源来构建视图。通过绑定的 isexpanded 属性，我们可以方便地控制视图的显示与隐藏。示例所示代码如下：

@state private var isexpanded = false

disclosuregroup(isexpanded: $isexpanded, content: {
  toggle("展开/收起", ison: $isexpanded)
  disclosuregroup("内嵌列表") {
    text("hello 1")
    text("hello 1")
    text("hello 1")
  }
}) {
  text("disclosure")
}

正如示例所示，outlinegroup 和 diclosuregroupview 其实都是可以相互嵌套使用的，以实现更为复杂的层级视图。

本文为 eul 样章，如果您喜欢，请移步 appstore/eul 查看更多内容。