时间戳

首页 > 解决方案 > 如何在swiftUI中的Foreach循环上显示除一项之外的图像？

ios - 如何在swiftUI中的Foreach循环上显示除一项之外的图像？

问题描述

我已经创建了一张卡片，我希望在每张卡片的顶部显示一张图片，除了第一张卡片。请帮我解决这个问题。

这是保存图像的结构。

struct XButton: View {
var body: some View {
    Image(systemName: "xmark")
            .font(.system(size: 17, weight: .bold))
            .foregroundColor(.white)
            .padding(.all, 10)
            .background(Color.black.opacity(0.6))
            .mask(Circle())
        }
}

这是包含 foreach 循环内卡片的滚动视图

ScrollView{
                    ForEach(CardsData) { item in
                    VStack {
                        
                        CardsView(Cards: item)

                          }
                }
          }

标签： iosarraysswiftswiftuiswiftui-list

解决方案

您可以在. enumerated()_ 然后，仅在有条件的情况下呈现ForEachXButtonindex == 0

然后，我习惯ZStack把它XButton放在上面。我假设您原始问题中的“在顶部”意味着重叠，但如果您只是指在 y 轴上更高，您可以将其更改回VStack

struct ContentView : View {
    var body: some View {
        ScrollView{
            ForEach(Array(CardsData.enumerated()), id: \.1.id) { (index,item) in
                ZStack {
                    CardsView(Cards: item)
                    if index == 0 {
                        XButton()
                    }
                }
            }
        }
    }
}

注意：这是假设CardsData项目符合Identifiable，如果您的原件有效，我假设他们这样做了ForEach。请注意，我从中获取的 id.1.id是id项目的属性，CardsData现在它是一个元组，其中第一部分 (0) 是索引，第二部分 (1) 是项目。

推荐阅读