SwiftUI中MapKit的safeAreaPadding动画异常问题求助

你在开发地图应用时，通过调整safeAreaPadding(.bottom)保证底部legal标签可见，非动画场景表现正常，但动画修改padding值减小时，地图出现尺寸跳变和图形异常——这是因为safeAreaPadding减小会触发SwiftUI重新计算Map的布局空间，而MapKit的Map视图在动画过程中重绘时容易出现这类异常。

下面是两种可行的解决方案：

方案一：使用safeAreaInset替代safeAreaPadding #

safeAreaInset是SwiftUI专门为安全区插入内容设计的API，动画表现更稳定。我们可以通过动画修改inset占位内容的高度，实现类似padding的效果：

import SwiftUI
import MapKit

struct MapSafeAreaInsetTest: View {
    @State var insetHeight: CGFloat = 0

    var body: some View {
        Map()
            .safeAreaInset(edge: .bottom) {
                // 用透明视图占位，动画修改其高度
                Color.clear
                    .frame(height: insetHeight)
                    .animation(.default, value: insetHeight)
            }
            .overlay(alignment: .top) {
                VStack {
                    Button("200") { insetHeight = 200 }
                    Button("100") { insetHeight = 100 }
                    Button("0") { insetHeight = 0 }
                }
                .buttonStyle(.borderedProminent)
            }
    }
}

方案二：固定Map的Frame高度 #

通过计算屏幕高度，给Map设置固定的frame高度，动画时直接修改frame的高度值，避免safeArea变化触发的布局重绘异常：

import SwiftUI
import MapKit

struct MapSafeAreaInsetTest: View {
    @State var padding: CGFloat = 0
    // 获取屏幕总高度
    private let screenHeight = UIScreen.main.bounds.height

    var body: some View {
        ZStack {
            Map()
                .edgesIgnoringSafeArea(.bottom)
                // 动画修改Map的高度，等于屏幕高度减去底部预留空间
                .frame(height: screenHeight - padding)
                .animation(.default, value: padding)

            VStack {
                Button("200") { padding = 200 }
                Button("100") { padding = 100 }
                Button("0") { padding = 0 }
            }
            .buttonStyle(.borderedProminent)
            .padding(.top)
        }
    }
}

这两种方案都能避免padding减小时的地图尺寸跳变问题，保证动画过程中地图渲染正常。

内容的提问来源于stack exchange，提问作者Benoît