我在SwiftUI中创建了一个应用程序,它显示一个正方形列表,每行包含2个单元格,每个单元格包含一个图像和文本。我所做的是每个单元格都是一个VStack(文本顶部的图像),然后包含在ZStack中(添加一个矩形,使其看起来像一个适当的单元格)。我想让ZStack可点击,点击时,导航到另一个视图。
这在UIKit(我已经使用了一段时间)中使用CollectionView非常容易,然后当每个单元格被选中时,只需将视图控制器推送到导航控制器。然而,由于我必须在SwiftUI中做这个项目,我不知道如何做到这一点。我已经尝试了NavigationViews和Navigation Links,但没有效果。
我的代码为细胞如下:
struct CellView: View {
var image: String
var body: some View {
ZStack{
VStack{
Image(image).resizable().frame(width: 100, height: 100).scaledToFit()
Text(image.capitalized).font(.system(size: 19, weight: Font.Weight.bold))
}
RoundedRectangle(cornerRadius: 20)
.stroke(Color(red: 220/255, green: 9/255, blue: 73/255), lineWidth: 5.0).frame(width: 150, height: 150)
}
}
init(image: String) {
self.image = image
}
}
struct RowView: View {
var image1: String
var image2: String
var body: some View {
HStack(alignment: .center, spacing: 20.0){
CellView(image: image1)
CellView(image: image2)
}
}
init(image1: String, image2: String) {
self.image1 = image1
self.image2 = image2
}
}
字符串
我试过使用NavigationViews和NavigationLinks,但都不起作用。
1条答案
按热度按时间tcbh2hod1#
让它工作的一种方法是将每个单元格 Package 为
NavigationStack
内的NavigationLink
。我不知道你的细节视图会是什么样子,但这里有一个虚拟的实现:
字符串
在
RowView
内部,将每个CellView
Package 为NavigationLink
:型
最后,
NavigationStack
位于父视图中:型