本篇为大家带来SwiftUI中Preference的第二个实战教程，最后的实效效果如下图：
其实，用SwiftUI实现上图的二叉树还算简单，节点与节点之间的连线，需要用到Preference的知识。
定义数据结构
二叉树上的节点由两部分组成：
- 值
- 子节点
struct Tree<A>: Identifiable {
let id = UUID().uuidString
var value: A
var children: [Tree<A>] = []
init(_ value: A, children: [Tree<A>] = []) {
self.value = value
self.children = children
}
}
复制代码我们用value表示该节点的值，它是一个范型，因此该值可以显示任何类型的数据，用children表示该节点的子节点，之所以让Tree实现Identifiable，目的是后续的代码需要遍历子节点，会用到ForEach。
绘制节点
由于每个节点可能存在n多个子节点，并且子节点在父节点的下方，我们很自然的考虑使用VStack包装一个HStack，示意图如下：
struct DiagramSample<A, V: View>: View {
let tree: Tree<A>
let node: (A) -> V
var body: some View {
VStack(spacing: 10) {
node(tree.value)
HStack(alignment: .bottom, spacing: 10) {
ForEach(tree.children) { child in
DiagramSample(tree: child, node: self.node)
}
}
}
}
}
复制代码上边的代码很好理解，采用递归的方法显示各个节点。为了查看效果，我们举个
以上内容来自于网络,如有侵权联系即删除
