首页 > 解决方案 > 在 SwiftUI 中正确组合 TabView 与 PageTabViewStyle、NavigationView 和 ScrollView

问题描述

我正在开发一个将 TabView 与 PageTabViewStyle、NavigationView 和 ScrollView 相结合的 UI。向下滚动时,我希望 NavigationView 的标题会调整并变小。但是当 ScrollView 放置在 TabView 内时它不会。如何实现此行为?

这是我关于如何将 TabView 与 PageTabViewStyle 和 NavigationView 一起使用的原始问题的扩展。

struct ContentView: View {
    @State var selection = 1
    
    var body: some View {
        NavigationView {
            TabView {
                LibraryView()
                    .tag(1)
                LibraryView()
                    .tag(2)
            }
            .navigationTitle(selection == 1 ? "A" : "B")
        }
        .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
        //.indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
    }
}
struct LibraryView: View {
    
    @State var gridLayout: [GridItem] = [
        GridItem(),
        GridItem()
    ]
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: gridLayout, alignment: .center, spacing: 10) {
                ForEach(collections.indices) { index in
                    CollectionItem(collection: collections[index])
                }
            }
            .padding(.all, 10)
        }
    }
}

标签: swiftui

解决方案


推荐阅读