ios 如何使用NavigationLink将.presentationBackground修改器应用到图纸中的第二个视图?

8iwquhpp  于 2023-06-25  发布在  iOS
关注(0)|答案(1)|浏览(129)

我在网上搜索了一段时间,似乎找不到一个答案来帮助我解决这个问题,因为. presentationBackground修饰符是如此新。

    • 问题:**

当将. presentationBackground修改器应用于呈现的工作表时,修改器不会应用于通过呈现工作表上的NavigationLink呈现的第二个视图。显示为图纸的第一个视图具有材质背景,但NavigationLink中的第二个视图具有纯白色背景。

    • 上下文:**
  • 在iOS 16.4和Xcode 14.3的iPhone 14上运行模拟器 *

我目前有一个视图,其中有一个按钮,显示工作表:

struct ParentView: View {
    @State private var showingAddItemSheet = false
    
    @available(iOS 16.4, *)
    var body: some View {
        NavigationView {
            VStack {
                Button {
                    showingAddItemSheet.toggle()
                } label: {
                    Image(systemName: "plus")
                        .font(Font.system(size: 32, weight: .semibold))
                        .foregroundColor(Color.white)
                    
                }
                .sheet(isPresented: $showingAddItemSheet) {
                    AddItemView(isPresented: $showingAddItemSheet)
                        .presentationDetents([.fraction(0.6)])
                        .presentationDragIndicator(.visible)
                        .presentationBackground(.ultraThinMaterial)
                }
            }
            .background(Color.green)
        }
    }
}

该图纸包含指向第二个视图的NavigationLink:

struct AddItemView: View {
    @Binding var isPresented: Bool
    @State private var itemName: String = ""
    
    @State private var itemDetails: String = ""
    
    var body: some View {
        NavigationView {
            VStack(alignment: .leading) {
                Text("Add Item")
                
                TextField("Name", text: $itemName)
                
                NavigationLink("Add Item Details") {
                    AddItemDetailsView(itemDetails: $itemDetails)
                }
            }
        }
    }
}

第二个视图不保留初始工作表中的. presentationBackground修饰符,但保留. presentationDetents和. presentationDragIndicator。

struct AddItemDetailsView: View {
    @Environment(\.dismiss) var dismiss
    
    @Binding var itemDetails: String
    
    var body: some View {
        VStack(alignment: .leading) {
            Text("Add Item Details")
            
            TextField("Details", text: $itemDetails)
            
            Button("Done") {
                dismiss()
            }
        }
    }
}
    • 我尝试过的:**

以下操作均无法使. presentationBackground(. ultraThinMaterial)应用于第二视图:

  • 将. presentationBackground修饰符添加到NavigationLink目标中的AddItemDetailsView()
  • 直接使用常规的. background修改器将AddItemDetailsView的. background设置为Color. clear或. ultraThinMaterial。
  • 将AddItemView上的NavigationView更改为NavigationStack

非常感谢这里的任何想法或指导如何让第二个AddItemDetailsView像第一个AddItemView工作表一样使用. ultraThinMaterial背景!

8fq7wneg

8fq7wneg1#

我用它玩了一点,据我所知,NavigationLink不具有与Sheet相同的功能,反之亦然。因此,您可以使用另一个NavigationLink,而不是使用Sheet,但视图层次结构使其成为相同的材质,因为它将在另一个Sheet的前面。

struct AddItemView: View {
    @Binding var isPresented: Bool
    @State private var itemName: String = ""
    
    @State private var itemDetails: String = ""
    
    @State private var showingAddItemSheet = false
    
    var body: some View {
        NavigationView {
            VStack(alignment: .leading) {
                Text("Add Item")
                
                TextField("Name", text: $itemName)
                
                Button {
                    showingAddItemSheet.toggle()
                } label: {
                    Text("Add Item Details")
                }
            }
            .sheet(isPresented: $showingAddItemSheet) {
                AddItemDetailsView(itemDetails: $itemDetails)
                    .presentationDetents([.fraction(0.6)])
                    .presentationDragIndicator(.visible)
                    .presentationBackground(.ultraThinMaterial)
            }
        }
    }
}

如果你将AddItemView工作表拉到顶部,你会看到材质上的一个小差异,但正如我所说,一个工作表在一个工作表的顶部,两者都有修改器,只是使它有点暗,因为它看起来到另一个工作表。

相关问题