SwiftUI：如何在List中添加无行容器且可随列表滚动的元素

要实现让元素随List滚动但不应用行容器样式，可通过修改列表行的相关修饰符消除默认行样式：

修改后的示例代码 #

struct ContentView: View {
    var body: some View {
        VStack {
            List {
                Text("Hello")
                Text("Hello")
                Text("Hello")
                Text("Hello")
                
                // 目标文本：移除行容器样式
                Text("How to make this text be outside a row container but in the List scroll?")
                    .listRowInsets(EdgeInsets(top: 0, leading: 0, bottom: 0, trailing: 0))
                    .listRowBackground(Color.clear)
            }
            .listStyle(.plain)
            .onAppear {
                // 隐藏列表分隔线（按需选择）
                UITableView.appearance().separatorStyle = .none
            }
            .onDisappear {
                // 恢复默认分隔线样式，避免影响其他页面
                UITableView.appearance().separatorStyle = .singleLine
            }
        }
    }
}

关键修饰符说明 #

• listRowInsets(EdgeInsets(...))：移除行的默认内边距，让文本完全贴合列表宽度
• listRowBackground(Color.clear)：将行背景设为透明，消除默认的行底色
• .listStyle(.plain)：切换到简约列表样式，减少默认样式对自定义元素的干扰
• 分隔线控制：通过UITableView.appearance()全局调整分隔线，记得在页面消失时恢复默认值，防止影响其他视图的List样式

如果不需要List的编辑、滑动删除等特性，也可以直接用ScrollView嵌套VStack实现完全自定义的滚动布局，灵活度更高。

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