You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何让iOS14 SDK编译的SwiftUI List Section头尾布局在iOS15上正常显示

问题描述

用Xcode 12.5.1(基于iOS 14 SDK)构建的App,在iOS 15设备上运行时会出现SwiftUI Section布局异常:表头底部内边距过大、顶部内边距不足,表尾顶部内边距也不足。
如果改用Xcode 13 beta 5基于iOS 15 SDK编译,布局可以恢复正常,但iOS 15 SDK GM版本发布前无法提交对应编译包,需要仅通过iOS 14可用的API修复该问题。

示例代码

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                Section(header: Text("Header"), footer: Text("Footer text goes here.")) {
                    Text("Cell one")
                    Text("Cell two")
                }
            }.listStyle(GroupedListStyle())
            .navigationTitle("Hello Stack Overflow")
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}

异常效果

异常布局截图

正常效果(Xcode 13构建)

正常布局截图

修复方案

以下两种方案均基于iOS 14支持的API实现,Xcode 12.5.1可正常编译:

  • 方案1:单Section单独适配(无全局影响)
    针对需要调整的Section的表头、表尾添加条件内边距即可,数值可根据实际设计效果微调:
struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                Section(
                    header: VStack(alignment: .leading, spacing: 0) {
                        Text("Header")
                        // 仅iOS15设备执行适配
                        if #available(iOS 15, *) {
                            Spacer().frame(height: 14)
                        }
                    },
                    footer: VStack(alignment: .leading, spacing: 0) {
                        if #available(iOS 15, *) {
                            Spacer().frame(height: 8)
                        }
                        Text("Footer text goes here.")
                    }
                ) {
                    Text("Cell one")
                    Text("Cell two")
                }
            }.listStyle(GroupedListStyle())
            .navigationTitle("Hello Stack Overflow")
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}
  • 方案2:全局适配(推荐,无需逐个修改Section)
    iOS14 SDK编译的App在iOS15上运行时,List底层依然基于UITableView实现,可以在App启动时通过运行时逻辑修改全局配置,改一次全App生效:
// 在AppDelegate的didFinishLaunchingWithOptions方法中执行一次即可
if #available(iOS 15, *) {
    // 运行时判断属性存在再赋值,不会触发编译报错
    if UITableView.instancesRespond(to: NSSelectorFromString("setSectionHeaderTopPadding:")) {
        UITableView.appearance().setValue(0, forKey: "sectionHeaderTopPadding")
    }
    UITableView.appearance().sectionHeaderHeight = UITableView.automaticDimension
    UITableView.appearance().sectionFooterHeight = UITableView.automaticDimension
}

后续升级到Xcode13正式版编译时,直接删掉这段适配代码即可。

内容的提问来源于stack exchange,提问作者Andrew Bennet

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.06 23:36:04