如何让SwiftUI Form中的LabeledContent与Text顶部对齐？

默认情况下，Form中的LabeledContent会将标题垂直居中对齐，导致多行内容的首行无法和标题对齐。要实现标题与内容首行对齐且内容自动换行，无需使用Grid组件，可通过以下两种方式解决：

方案一：自定义LabeledContent样式 #

创建顶部对齐的自定义样式，通过HStack强制标题和内容顶部对齐：

struct TopAlignedLabeledContentStyle: LabeledContentStyle {
    func makeBody(configuration: Configuration) -> some View {
        HStack(alignment: .top, spacing: 16) {
            configuration.label
                .frame(maxWidth: .infinity, alignment: .leading)
            configuration.content
                .frame(maxWidth: .infinity, alignment: .leading)
        }
    }
}

将样式应用到LabeledContent，并确保内容文本允许自动换行：

struct InspectorView: View {
    var body: some View {
        Form {
            LabeledContent("Title") {
                Text("A description that should wrap and top align")
                    .fixedSize(horizontal: false, vertical: true)
            }
            .labeledContentStyle(TopAlignedLabeledContentStyle())
        }
    }
}

方案二：直接调整标题对齐（无需自定义样式） #

给标题文本添加顶部对齐的frame，同时设置内容文本允许换行：

struct InspectorView: View {
    var body: some View {
        Form {
            LabeledContent {
                Text("Title")
                    .frame(maxHeight: .infinity, alignment: .top)
            } label: {
                Text("A description that should wrap and top align")
                    .fixedSize(horizontal: false, vertical: true)
            }
        }
    }
}

两种方案都能实现标题与内容首行顶部对齐，同时保证描述文本自动换行的需求。

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