SwiftUI：List 和 TabView 相互重叠-解网

问：

在我的应用程序中，我尝试显示：在屏幕顶部，然后，然后使用屏幕右下角的简单按钮，然后使用SegmentedPickerListsafeAreaInsetTabView

我的问题是在屏幕底部，并且相互重叠。最后附上截图ListTabView

以下是我的代码TabView

struct ContentView: View {
    var body: some View {
        TabView {
            NavigationStack {
                FirstView()
            }
            .tabItem {
                Label("First", systemImage: "pencil")
            }
            
            SecondView()
                .tabItem {
                    Label("Second", systemImage: "pencil.circle.fill")
                }
        }
    }
}

以下是我的第一个 TabView 的代码。

看起来我的一些问题在里面。因为如果我删除，我没有任何问题。PickerVStackPicker

struct FirstView: View {
    var firstViewPicker = ["one", "two", "three"]
    @State private var segmentSelection = 0

    var body: some View {
        VStack {
            //MARK: - Picker related stuff
            Picker("", selection: $segmentSelection) {
                ForEach(0..<firstViewPicker.count, id: \.self) { id in
                    Text(firstViewPicker[id])
                }
            }
            .pickerStyle(.segmented)
            .padding()
            
            List {
                ForEach(0..<40, id: \.self) { id in
                    Text("Row Item #\(id)")
                }
            }
            .listStyle(.grouped)                
        }
        .navigationTitle("Home")
        .navigationBarTitleDisplayMode(.inline)
        .safeAreaInset(edge: .bottom, alignment: .trailing) {
            Button(action: {
                print("Tapped")
            }, label: {
                Image(systemName: "trash.circle.fill")
                    .symbolRenderingMode(.palette)
                    .foregroundStyle(.white, .brown)
                    .font(.system(size: 50))
            })
            .padding()
            .shadow(color: .gray, radius: 5, x: 0, y: 0)
        }
    }
}

以下是我的第二个 TabView 的代码

struct SecondView: View {
    var body: some View {
        Text("Hello, 2nd  world!")
    }
}

以下是屏幕截图，其中我遇到了和ListTabView

我在这里做错了什么吗？我们怎样才能做到这一点？请帮忙

仅供参考：我正在使用 macOS 13.3、Xcode 14.3、Simulator 14 Pro Max 和 iOS 16.4

仅供参考：刚刚注意到无法在 iPhone-12、iPhone 模拟器-14 上重现。并且可以在 iPhone 模拟器 -14 pro、iPhone 模拟器-14 pro max 上重现

iOS SwiftUI swiftUI列表 swiftui-tabview swiftui-picker

struct ContentView: View {
    var body: some View {
        TabView {
            NavigationStack {
                FirstView()
            }.padding()
            .tabItem {
                Label("First", systemImage: "pencil")
            }
            
            SecondView()
                .tabItem {
                    Label("Second", systemImage: "pencil.circle.fill")
                }
        }
    }
}

上一个：选取器可访问性。SWIFT 用户界面

下一个：使用分区时，列表中的 SwiftUI 选取器会在顶部添加额外的行

SwiftUI：List 和 TabView 相互重叠

SwiftUI: List and TabView are getting over-lapped each other

评论