我想从子视图显示底部工作表或模式视图,但应该覆盖在整个应用程序的顶部,即使有选项卡或导航栏。例如:
struct ContentView: View {
@State private var selected = 0
var body: some View {
TabView(selection: $selected) {
Content1View()
.tabItem {
Image(systemName: "1.circle")
Text("First")
}
.tag(0)
}
}
}
struct Content1View: View {
var body: some View {
Text("Content 1")
.overlay(
Color.blue
.opacity(0.1)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.ignoresSafeArea()
)
}
}
如何在不让标签栏做到这一点的情况下,在整个应用程序顶部制作蓝色叠加层?
答案 0 :(得分:0)
对于底部工作表,即使使用标签或导航栏,.sheet modifier 实际上也能做到这一点:
struct Content1View: View {
@State var showSheet = false
var body: some View {
Button(action: { showSheet = true}) {
Text("Content 1")
}
.sheet(isPresented: $showSheet) {
Color.blue
.opacity(0.1)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.ignoresSafeArea()
}
}
}
.fullScreenCover 的工作方式相同,但覆盖整个屏幕:
struct Content1View: View {
@State var showSheet = false
var body: some View {
Button(action: { showSheet = true}) {
Text("Content 1")
}
.fullScreenCover(isPresented: $showSheet) {
Color.blue
.opacity(0.1)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.ignoresSafeArea()
}
}
}