SwiftUI 中的垂直卡片堆栈视图

问题描述

我想垂直制作一个卡片堆视图,它与相关卡片重叠。

喜欢

enter image description here

我尝试使用我的示例代码,但没有奏效。偏移参数中遗漏了一些东西。请节省我的时间。

示例代码

// A card stack view that shows the data for Restaurant
struct CardStackView: View {
    // static data
    let restaurants = [
        Restaurant(name: "Joe's Original"),Restaurant(name: "The Real Joe's Original"),Restaurant(name: "Original Joe's")
    ]
    
    var body: some View {
        ScrollView {
            LazyVStack() {
                ForEach(restaurants.indices) { index in
                    CardView(restaurant: restaurants[index],index: index)
                }
            }
        }
    }
}

// Data struct
struct Restaurant: Identifiable {
    let id = UUID()
    let name: String
}

// Card View
struct CardView: View {
    var restaurant: Restaurant
    var index: Int
    
    let color: [Color] = [.blue,.red,.yellow]
    
    var body: some View {
       
        ZStack(){
            color[index%3]
                .cornerRadius(10.0)
                .padding(.trailing)
                .offset(y: 20.0)
            
            Text("Come and eat at \(restaurant.name)")
                .padding(EdgeInsets(top: 20,leading: 20,bottom: 30,trailing: 20))
                .foregroundColor(.white)
        }
    }
}

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)