Table in SwiftUI

In many apps we require list of items in a scrollable format, for this we used UITableView as of now.

In SwiftUI we have many ways to create a Table. I will try to cover a few ways here.

1. ForEach Loop with List:

struct ContentView: View {

    var body: some View {

        List {

            ForEach(0..<10) { index in

                Text("Current Row - \(index)")

            }

        }

    }

}

2. List directly:

struct ContentView: View {

    var body: some View {

        List(0..<10) { index in

            Text("Current Row - \(index)")

        }

    }

}

3. Form directly:

struct ContentView: View {

    var body: some View {

        Form {

            Text("Row 0")

            Text("Row 1")

            Text("Row 2")

        }

    }

}

4. Form with Sections:

struct ContentView: View {

    var body: some View {

        Form {

            Section (header: Text("SECTION 0 Starts Here"), content: {

                Text("Section 0 Row 0")

                Text("Section 0 Row 1")

                Text("Section 0 Row 2")

            })

            Section (footer: Text("SECTION 1 Ends Here")) {

                Text("Section 1 Row 0")

                Text("Section 1 Row 1")

                Text("Section 1 Row 2")

            }

        }

    }

}

5. Form with VStack:

struct ContentView: View {

    var body: some View {

        Form {

            VStack(alignment:.leading , spacing:50) {

                Text("Row 0")

                Text("Row 1")

                Text("Row 2")

            }

        }

    }

}

So we now know we have many ways to get started with a Table in SwiftUI.

In our next tutorial lets try to create a Reusable Cell.