如何调整SwiftUI List行分隔符内边距 实现系统设置App的Label展示效果

在SwiftUI开发中，暂未找到基于原生List API的优雅方案，实现包含Image和Text组合（即Label）的List行分隔符样式与系统设置App对齐的效果。

预期效果 #

当前常规实现代码 #

// 常规实现代码
NavigationView {
    List {
        NavigationLink {
            Text("Detail 1")
        } label: {
            Label {
                Text("Row Title 1")
            } icon: {
                Image(systemName: "gear")
            }
        }

        NavigationLink {
            Text("Detail 3")
        } label: {
            Label {
                Text("Row Title 3")
            } icon: {
                Image(systemName: "wifi")
            }
        }

        NavigationLink {
            Text("Detail 2")
        } label: {
            Label {
                Text("Row Title 2")
            } icon: {
                Image(systemName: "person")
            }
        }
    }
    .listStyle(.insetGrouped)
    .navigationTitle("Demo")
}

当前实现效果 #

iOS 15及以上版本可通过原生对齐引导API实现，无需自定义分隔符或硬编码边距：
给Label中的文本部分添加alignmentGuide修饰符，指定列表分隔符的起始位置与文本左边缘对齐即可：

NavigationView {
    List {
        NavigationLink {
            Text("Detail 1")
        } label: {
            Label {
                Text("Row Title 1")
                    .alignmentGuide(.listRowSeparatorLeading) { $0[.leading] }
            } icon: {
                Image(systemName: "gear")
            }
        }

        NavigationLink {
            Text("Detail 3")
        } label: {
            Label {
                Text("Row Title 3")
                    .alignmentGuide(.listRowSeparatorLeading) { $0[.leading] }
            } icon: {
                Image(systemName: "wifi")
            }
        }

        NavigationLink {
            Text("Detail 2")
        } label: {
            Label {
                Text("Row Title 2")
                    .alignmentGuide(.listRowSeparatorLeading) { $0[.leading] }
            } icon: {
                Image(systemName: "person")
            }
        }
    }
    .listStyle(.insetGrouped)
    .navigationTitle("Demo")
}

如果需要简化重复代码，可以扩展Label添加统一修饰符：

extension Label where Title == Text, Icon == Image {
    func alignListSeparator() -> some View {
        self.alignmentGuide(.listRowSeparatorLeading) { $0[.leading] }
    }
}

// 调用示例
Label("Row Title 1", systemImage: "gear")
    .alignListSeparator()

该方案完全基于原生API，可自动适配动态类型、系统语言方向等场景，不需要手动调整固定偏移值。

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