我一直在try 创建一个列表并扩展行之间的空间,同时保持它们的全宽,但我似乎遇到了一些挑战.我认为方法是让列表中的HStack从一端水平扩展到另一端,并try 缩小顶部和底部.我以为帧修改器可以做到这一点,但它似乎不起作用.
代码如下:
NavigationView() {
List(caseList) {caseItem in
HStack {
Image(systemName: "folder.fill.badge.person.crop")
.foregroundColor(.accentColor)
VStack(alignment: .leading, spacing: 5) {
Text(caseItem.alias)
Text("# team members")
.font(.subheadline)
.foregroundColor(.secondary)
}
}
.listRowInsets(EdgeInsets())
.background(Color.green)
.clipShape(RoundedRectangle(cornerRadius: 10))
.badge(Int.random(in: 0..<5))
.listRowSeparatorTint(Color.cyan, edges: .all)
.listRowSeparator(.visible)
.listRowBackground(Color.orange)
.frame(
maxWidth: .infinity,
minHeight: 0,
maxHeight: .infinity,
alignment: .topLeading
)
}
.listStyle(InsetGroupedListStyle())
}
.onAppear() {
loadCases()
}
.navigationTitle("Cases")
我还想删除列表项目和顶部 case 之间的差距.
UPDATE
我添加了第二张图片,以红色显示我希望绿色形状覆盖的内容.我想我的目标是让它们看起来更像独立的项目,有更多的信息和更大的间距.这不应该是一个详尽的 list ,在大多数情况下,人们只会有一个,所以我正在努力使其成为实质性的 list .我在玩扩展/折叠的,所以如果你只有一个,它会被扩展,看起来不会那么孤独.