Programmatically designing Table View in Swift

Designing Table View:

      Table view displays a list of elements or basically call them cells, that can be scrolled up & down vertically. They are the objects of the UITableView Class. Table View contains a vertically scrollable list of cells. The cells are the instance of the UITableViewCell class. UITableView is a subclass of UIScrollView. TableView uses UITableViewDelegate && UITableViewDataSource  methods to balance the User Interface && the Data that the table View is displaying. If you are using storyboard && on the top of the default view you dragged && dropped the TableView the you need to manually connect the UITableViewDelegate && UITableViewDataSource to use the methods of these. But if you are using UITableViewController then you don't need to de all this these two are already connected. The below image shows the table view:

      We will be designing this view but programmatically without using standard Object Library provided UITableView or UITableViewController.

1. As usual go ahead & create new Xcode project with single view application template & name it "programmaticallyTableView" & choose language as "Swift".

2. Open the ViewController.Swift file in the "Project Navigator" & add the following bit of code in the "viewDidLoad()" method.

        var tableView = UITableView()

            //creating instance of the table view

        tableView.frame = CGRectMake(0, 20, 320, 568)

            //designing the frame of the table view

        tableView.dataSource = self

            //assigning the data source of the table view

        tableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "cell")

            //registering the cell's class

        self.view.addSubview(tableView)

            //adding view to the view controller

     Here in this code all we are doing is in 1st line creating an instance of the "UITableView" then designing the frame according to the size of the simulator screen with parameter (x,y,width,height) in CGRectMake( function) then because we are only using the datasource methods of the table view so in 3rd line we declared the tableView as its source of data for itself.After the in 4th line we are registering the class for each cell that our table view will show.& then finally adding the view that we created programmatically for our table view.

3. Now declare an array globally for all functions inside the class but local to the class itself like: 

class ViewController: UIViewController, UITableViewDataSource  {

var array = ["viney", "kartik" , "kasam", "kismat", "garima" , "ravinder", "vikas", "vipin", "vineet", "vipun" , "vipul", "navika", "nitish" , "navneet", "kanika", "kabita", "shubham", "ravi" ,"ravina", "reet", "geet", "geetika", "kirti" , "navika", "lovish","nipun", "ramesh", "ravi", "niki", "nitin", "rina", "pooja"]

            //array which is to be populated in the table rows

4. Insert two DataSource methods named : tableView: cellForRopAtIndexPath && tableView:numberOfRowsInSection && mimic && add the same code as shown below: 

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

                //datasource method returning the what cell contains

        var cell = tableView.dequeueReusableCellWithIdentifier("cell", forIndexPath: indexPath) as UITableViewCell

    \\reusing the previous scrolled cells from table view(if any)

        cell.textLabel?.text = array[indexPath.row]  

              \\passing each elements of the array to cell    

        return cell

    }

    

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

                //datasource method returning no. of rows

        return array.count

    }

    In the first function we are doing is just to deliver the content of each cell that will be displayed in tableView. And in the second function we are returning total number of rows the tableView will contain (here array.cont which represents number of elements in the array). At this point your ViewController.Swift file should looks like:

4. Now guys go ahead & Build your app && with some luck you will be able to see the view as shown in the first Image in this tutorial. And keep in mind we specified the coordinates (x,y,width,height) for the screen of iPhone 5s but you can change them according to your will.Now go ahead & practice it.

I hope this tutorial was a good help for you guys.....