作为iOS UI中最常见和常用的视图组件，在SwiftUI中的“平替”品是什么呢？

一、创建SwiftUI工程

用xcode 13以上版本创建Mac & iOS 项目。

打开 ContentView.Swift，开始撸代码：

• 添加Navigation View

var body: some View {
        NavigationView {
            Text("hello world")
        }
        .navigationViewStyle(StackNavigationViewStyle())

    }

• 添加TableView平替方案List, items 数据源自建~

var body: some View {
        NavigationView {
            List {
                ForEach(items, id:\.self) { item in
                    HStack {
                        Image(systemName: "checkmark.circle.fill")
                            .font(.title2)
                            .foregroundColor(Color.blue)
                        Text(item)
                    }
                }
            }
            .navigationTitle("待办事项")
        }
        .navigationViewStyle(StackNavigationViewStyle())
    }

• 给ListView添加左右滑动按钮

var body: some View {
        NavigationView {
            List {
                ForEach(items, id:\.self) { item in
                    HStack {
                        Image(systemName: "checkmark.circle.fill")
                            .font(.title2)
                            .foregroundColor(Color.blue)
                        Text(item)
                    }
                    .swipeActions {
                        Button {
                            print(item)
                        } label: {
                            Image(systemName: "bell")
                        }
                        .tint(.yellow)
                        Button {
                            print(item)
                        } label: {
                            Image(systemName: "trash")
                        }
                        .tint(.red)
                    }
                    .swipeActions(edge: .leading, allowsFullSwipe: false) {
                        Button {
                            print(item)
                        } label: {
                            Image(systemName: "gear")
                        }
                        .tint(.purple)
                    }
                }
            }
            .navigationTitle("待办事项")
        }
        .navigationViewStyle(StackNavigationViewStyle())
    }

效果如下：