TableView or ListView in SwiftUI

December 22, 2020 No Comments Development Pushpendra Kumar

Hey, Guys welcome to this tutorial. In this complete video, I will make you understand the quick trick for TableView or ListView in SwiftUI. And this is a simple way to achieve our goals. Through this simple video tutorial, you can learn more interesting things about the SwiftUI. In this video tutorial, you can learn the basics for ListView in SwiftUI. And also you can get the answer of How to started with TableView or ListView in SwiftUI. Let’s dive into he programming and become a best iOS developer. So watch the complete video. And if you watched the complete video then do not forget to give your suggestion in the comment box. Because your feedback & suggestions do matter for me 😊😊😊😊👇🏻

And finally, I would like to say that, If you like this video and it’s helpful for your project then click on the like button and do not forget to subscribe to this YouTube channel for future updates.

I Hope you have seen the complete video tutorial. Please find the code below related to this video.

Start Development

At the very first please get the code for DemoList class

//
//  DemoList.swift
//  TableViewSwiftUI
//
//  Created by Pushpendra on 20/12/20.
//

import Foundation
import SwiftUI

class DemoList: Identifiable, Codable {
    class DemoData: Identifiable, Codable {
        var id : String? = nil
        var title : String? = nil
        var description : String? = nil
    }
    
    func getList() -> [DemoData] {
        var list:[DemoData] = []
        for i in 0...19 {
            let model = DemoData()
            model.id = "\(i + 1)"
            model.title = "This is title \(i + 1)"
            model.description = "Hey this is the complete description of \(model.title!)"
            list.append(model)
        }
        return list
    }
}

Grate, Now get the code for another class

TableView | ListView in SwiftUI Row Design

//
//  DemoRow.swift
//  TableViewSwiftUI
//
//  Created by Pushpendra on 20/12/20.
//

import Foundation
import SwiftUI

struct DemoRow : View {
    var dataModel : DemoList.DemoData
    
    var body: some View {
        HStack {
            Image("test")
                .resizable()
                .clipShape(Circle())
                .overlay(Circle().stroke(Color.white, lineWidth: 2))
                .shadow(radius: 10)
                .frame(width: 70, height: 70, alignment: .center)
            VStack(alignment: .leading) {
                Text(dataModel.title ?? "N/A")
                    .fontWeight(.heavy)
                    .font(/*@START_MENU_TOKEN@*/.title/*@END_MENU_TOKEN@*/)
                    .multilineTextAlignment(.leading)
                Text(dataModel.description ?? "N/A")
            }
            .padding(.leading)
        }
    }
}

struct DemoView_Previews : PreviewProvider {
    static var previews: some View {
        DemoRow(dataModel: DemoList().getList()[0])
    }
}

Wonderful Job, Now finally get the code for your content view.

//
//  ContentView.swift
//  TableViewSwiftUI
//
//  Created by Pushpendra on 20/12/20.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        let myList = DemoList().getList()
        NavigationView {
            List(myList) { model in
                DemoRow(dataModel: model)
            }
            .navigationBarTitle("My List")
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

It’s completed 😊😊😊😊😊

In Conclusion, You have done with this tutorial. And I hope now the concept of TableView or ListView in SwiftUI is clear. Firstly, If you have any doubts regarding the TableView or ListView in SwiftUI. Then you can comment into the comment box. And If you like this tutorial with a complete description of the simple and attractive tutorial in Android then please like my video on YouTube and do not forget to subscribe to my YouTube channel. Because you will get lots of videos related to iOS development with very sort tricks.

In addition, If you are more curious about the development and knowing about tutorials then follow the below links