SwiftUI LazyVStack子视图滚动到导航栏下方时提前消失如何解决

问题复现代码 #

NavigationView {
    ZStack {
        ScrollView {
            LazyVStack {
                ForEach(model.wallets, id: \.id) { wallet in
                    GalleryCell(wallet: wallet)
                }
            }
        }
    }
}

问题表现 #

根因说明 #

LazyVStack的元素回收逻辑默认以ScrollView的初始可视区域边界为准，当导航栏为透明状态时，系统会默认将ScrollView的内容延伸到导航栏下方，导致LazyVStack计算元素是否在可视区域时出现偏差，滚动到导航栏下方的元素会被误判为已离开可视区域，被提前回收销毁。

解决方案 #

• 方案1：手动适配安全区，禁用ScrollView自动延伸到导航栏下方的逻辑，手动设置LazyVStack顶部内边距适配导航栏高度：

NavigationView {
    ZStack {
        ScrollView {
            LazyVStack {
                ForEach(model.wallets, id: \.id) { wallet in
                    GalleryCell(wallet: wallet)
                }
            }
            // 手动适配状态栏+导航栏总高度
            .padding(.top, (UIApplication.shared.connectedScenes
                .filter {$0.activationState == .foregroundActive
                .compactMap { $0 as? UIWindowScene }
                .first?.windows
                .filter { $0.isKeyWindow }?.safeAreaInsets.top ?? 0) + 44
        }
        // 忽略顶部安全区，让ScrollView可视区域覆盖导航栏下方区域
        .ignoresSafeArea(.container, edges: .top)
    }
}

• 方案2：使用safeAreaInset修饰符自动适配，无需手动计算高度，适配性更强，支持iOS15及以上版本：

NavigationView {
    ZStack {
        ScrollView {
            LazyVStack {
                ForEach(model.wallets, id: \.id) { wallet in
                    GalleryCell(wallet: wallet)
                }
            }
            .safeAreaInset(edge: .top) {
                Color.clear.frame(height: 0)
            }
        }
    }
}

• 方案3：设置导航栏为不透明，系统不会将ScrollView内容延伸到导航栏下方，自然不会出现元素提前消失问题：

// 页面初始化时全局设置
init() {
    UINavigationBar.appearance().isTranslucent = false
}

// iOS16+也可以用SwiftUI原生修饰
.navigationBarTitleDisplayMode(.inline)
.toolbarBackground(.visible, for: .navigationBar)
.toolbarColorScheme(.light, for: .navigationBar)

• 方案4：禁用ScrollView自动调整内容边距的逻辑：

// 全局统一设置
init() {
    UIScrollView.appearance().automaticallyAdjustsScrollIndicatorInsets = false
    UIScrollView.appearance().contentInsetAdjustmentBehavior = .never
}

内容的提问来源于stack exchange，提问作者Scott Andrew