Skip to main content

SwiftUI专辑026-用DisclosureGroup显示隐藏内容

· 预计阅读2分钟

headerimg DisclosureGroup根据disclosure control状态来控制显示和隐藏的一个视图。

需要两个参数：标识其content的label， 以及控制content是可见还是隐藏的binding。

我们创建一个例子来仔细看看它是如何工作的。

Getting ready​

首先，新建一个工程DisclosureGroups

How to do it…​

  1. 首先，创建一个State
@State private var showplanets = true
  1. 修改默认的Text为 List 和 DisclosureGroup
List {
    DisclosureGroup("Planets", isExpanded: $showplanets) {
        Text("Mercury")
        Text("Venus")
    }
}
  1. 再嵌套一个
var body: some View {
        List {
            DisclosureGroup("Planets", isExpanded: $showplanets) {
                Text("Mercury")
                Text("Venus")
                DisclosureGroup("Earth") {
                    Text("North America")
                    Text("South America")
                    Text("Europe")
                    Text("Africa")
                    Text("Asia")
                    Text("Antarctica")
                    Text("Oceania")
                }
            }
        }
    }

运行，最终结果

Simulator Screen Shot - iPhone 12 - 2021-12-29 at 00.18.08

How it works…​

我们通过showplanets 控制DisclosureGroup content的显示和隐藏。

DisclosureGroup 是能够嵌套的，用于显示多个层级。

DisclosureGroup也能脱离List单独使用。