滚动视图和 .sheet

ScrollView and .sheet

我有一个带有 ForEach 循环的 ScrollView,每个循环都呈现一个视图。在视图中,我有 3 个下面的 ActionItem 渲染图(一个显示 sheet 的按钮)。 sheet 不会出现在 ScrollView 中,但会出现在 List 中。我通常会在 ScrollView 层附加 .sheet 但是,每个按钮呈现不同的视图似乎更适合嵌套它。

我怎样才能让它与 ScrollView 一起工作?我正在使用 Xcode 12

struct ActionItem<Content>: View where Content : View {
    public var text: String
    public var icon: String
    public var content: Content
    @State var isPresented = false
    
    init(text: String, icon: String, @ViewBuilder content: () -> Content) {
        self.text = text
        self.icon = icon
        self.content = content()
    }
    
    var body: some View {
        Button (action: {
           DispatchQueue.main.async {
             withAnimation {
               self.isPresented = true
             }
            }
        }) {
            HStack(spacing: 2) {
                Image(systemName: icon).font(.system(size: 14, weight: .semibold))
                Text(text).fontWeight(.semibold)
                
            }.padding([.top, .bottom], Dimensions.spacing)
            .padding([.leading, .trailing], Dimensions.spacingMedium)
        }.foregroundColor(Color.gray).font(.subheadline).background(Color.grayWhiteTer)
        .cornerRadius(Dimensions.spacing)
        .sheet(isPresented: $isPresented) {
            self.content
        }
    }
}

在视图中,我将呈现诸如文本之类的 ActionItem,如果忽略视图并且 ActionItem 直接位于 ForEach 中,也会发生这种情况。同样的问题,sheet没有出现。

ActionItem(text: "", icon: "pencil") {
  Text("ok")
}

列表如下所示

import SwiftUI

struct ItemsList: View {
  @ObservedObject var itemModel: ItemModel
    
  var body: some View {
    VStack(alignment: .center, spacing: 0) {
      ScrollView {
        VStack {
            ForEach(itemModel.items, id: \.self) { item in
              ItemView(item: item)
            }
        }.frame(maxWidth: .infinity, maxHeight: .infinity)
}}

建议的回调更新

struct ActionItem<Content>: View where Content : View {
    public var text: String
    public var icon: String
    public var content: () -> Content
    @State var isPresented = false
    
    init(text: String, icon: String, @ViewBuilder content: @escaping () -> Content) {
        self.text = text
        self.icon = icon
        self.content = content
    }
    
    var body: some View {
        Button (action: {
            DispatchQueue.main.async {
               withAnimation {
                self.isPresented = true
               }
            }
            
        }) {
            HStack(spacing: 2) {
                Image(systemName: icon).font(.system(size: 14, weight: .semibold))
                    Text(text).fontWeight(.semibold)
                
            }.padding([.top, .bottom], Dimensions.spacing)
            .padding([.leading, .trailing], Dimensions.spacingMedium)
        }.foregroundColor(Color.gray).font(.subheadline).background(Color.grayWhiteTer)
        .cornerRadius(Dimensions.spacing)
        .sheet(isPresented: $isPresented) {
            self.content()
        }
    }
}

尝试将内容保存为回调(即 () -> Content)并在 sheet 方法中调用它,而不是在初始化程序中调用它。这将在创建视图时改变。