在 SwiftUI 中，containerRelativeFrame 是一种布局修饰符，用于为视图设置相对于其 父容器 的布局规则，比如宽度、高度和对齐方式。它特别适用于某些父容器（如 GeometryReader 或 ZStack）提供的布局约束。
1、containerRelativeFrame 的作用
containerRelativeFrame 提供了一种方式，让视图的尺寸和对齐方式直接依赖于父容器的几何形状。它可以设置相对宽度、高度以及对齐方式。
使用方式：
public func containerRelativeFrame(
_ axes: Axis.Set,
alignment: Alignment = .center,
_ length: @escaping (CGFloat, Axis) -> CGFloat
) -> some View主要参数说明：
axes：指定影响的轴，默认为 .all（横轴和纵轴，但不能设置为 .all）。可以设置为 .horizontal 或 .vertical。
alignment：对齐方式，默认为 .center。可以设置为.top, .center, .bottomTrailing 等。
length: (CGFloat, Axis) -> CGFloat
一个闭包，用于动态计算视图的宽度或高度：
第一个参数：容器的宽度或高度（取决于 Axis）。
第二个参数：当前计算的轴（.horizontal 或 .vertical）。
2、作用
根据父容器的宽度和高度动态调整子视图的尺寸。
使用闭包计算不同轴上的动态尺寸。
适合响应式布局场景，根据父视图调整子视图的宽高比例。
3、使用场景
动态设置宽度为屏幕的一半
struct ContentView: View {
var body: some View {
ZStack {
Rectangle()
.fill(Color.blue)
Rectangle()
.font(.headline)
.foregroundColor(.orange)
.containerRelativeFrame(.horizontal, alignment: .center) { size, axis in
size * 0.3
}
.background(Color.red)
}
.frame(width: 300, height: 300)
.clipped() // 确保内容不会超出
}
}解析：
.all 表示宽度和高度都会动态计算。
宽度为父容器的 30%。
使用 .background(Color.red) 可清晰看到动态调整的大小。
默认行为
1、容器参考：
containerRelativeFrame 会寻找当前视图所属的父容器的布局尺寸。如果父容器有明确的宽度、高度约束，则会基于这些约束计算宽度和高度。
如果没有明确的父容器约束，containerRelativeFrame 会参考更上层的约束，最终可能回退到整个屏幕尺寸（即 Window 或根布局）。
2、父容器的影响：
如果父容器是未约束大小的容器（如 ZStack、VStack、HStack），containerRelativeFrame 会尝试参考其更高层的父容器。
如果父容器明确限定了尺寸（如设置 .frame(width:height:) 或使用 GeometryReader），containerRelativeFrame 就会以该限定为基准。
总结
containerRelativeFrame 的特点：
相对于父容器调整视图尺寸和对齐方式。
适用于动态布局场景，简化视图在容器中的对齐和大小设置。
containerRelativeFrame 的参考尺寸由最近的明确父容器决定。
如果没有明确的父容器约束，containerRelativeFrame 会逐层向上查找，最终可能参考整个屏幕。
如果想要containerRelativeFrame 基于父容器而非屏幕，需要通过 .frame 或 GeometryReader 明确指定父容器的范围。
相关文章
SwiftUI容器视图GeometryReader：https://fangjunyu.com/2024/12/15/swiftui%e5%ae%b9%e5%99%a8%e8%a7%86%e5%9b%begeometryreader/
