Swift iOS开发：如何将Safe Area高度计入视图高度实现顶部banner适配

适配方案 #

问题原因 #

你当前的代码硬编码了y=-20、高度固定为90，这个数值仅适配非刘海屏20pt的状态栏高度，刘海屏/灵动岛设备的顶部安全区高度普遍在44pt及以上，硬编码的数值无法匹配动态的安全区高度，所以会出现内容和刘海重叠的问题。

基于Frame布局的修改方案 #

1. 先获取当前控制器顶部安全区的动态高度，注意不要在viewDidLoad阶段获取（此时视图未完成布局，拿到的值可能为0），建议把布局逻辑放在viewDidLayoutSubviews方法中执行：

// 获取顶部安全区高度
let topSafeInset = view.safeAreaInsets.top
// 你原本需要的banner实际内容高度（去掉原硬编码的20pt状态栏高度）
let bannerContentHeight: CGFloat = 70
// 计算最终banner总高度
let totalBannerHeight = topSafeInset + bannerContentHeight

// 修改shadowView的frame
let shadowView = UIView(frame: CGRect(x: -10, y: -topSafeInset, width: view.frame.width + 20, height: totalBannerHeight))
view.addSubview(shadowView)
shadowView.backgroundColor = .clear
shadowView.layer.shadowColor = UIColor.black.cgColor
shadowView.layer.shadowOpacity = 0.3
shadowView.layer.shadowOffset = CGSize(width: 5, height: 3)
shadowView.layer.shadowRadius = 4.0

// 修改titleView的frame
let titleView = UIView(frame: CGRect(x: 0, y: 0, width: shadowView.frame.width, height: totalBannerHeight))
shadowView.addSubview(titleView)
titleView.backgroundColor = .systemGreen
// 圆角随高度动态调整
titleView.layer.cornerRadius = totalBannerHeight / 2
titleView.layer.masksToBounds = true

2. 如果banner内部还有文字、图标等元素，记得把这些内容的顶部位置设置为topSafeInset，避免内容和刘海/灵动岛区域重叠。

更推荐的Auto Layout适配方案 #

用约束布局不需要手动计算frame，能自动响应安全区变化（比如横竖屏切换、iPad大小窗调整），适配性更强：

// 开启自动布局
shadowView.translatesAutoresizingMaskIntoConstraints = false
titleView.translatesAutoresizingMaskIntoConstraints = false

NSLayoutConstraint.activate([
    // shadowView顶部直接对齐父视图顶部，而非安全区顶部，实现覆盖安全区的效果
    shadowView.topAnchor.constraint(equalTo: view.topAnchor),
    shadowView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: -10),
    shadowView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 10),
    // 高度约束可后续在viewDidLayoutSubviews里根据安全区高度动态更新
    shadowView.heightAnchor.constraint(equalToConstant: view.safeAreaInsets.top + 70)
])

// titleView直接铺满shadowView
NSLayoutConstraint.activate([
    titleView.topAnchor.constraint(equalTo: shadowView.topAnchor),
    titleView.leadingAnchor.constraint(equalTo: shadowView.leadingAnchor),
    titleView.trailingAnchor.constraint(equalTo: shadowView.trailingAnchor),
    titleView.bottomAnchor.constraint(equalTo: shadowView.bottomAnchor)
])

内容的提问来源于stack exchange，提问作者José Miguel Lapa