Creating TableView In Swift

In this article, you will learn how to create a TableView in Swift. TableView is basically a view that presents data using rows arranged in a single column. Today, we will display a simple list of fruits on the iPhone device using TableView.

 

Prerequisites

1. MacOS
2. Xcode

Step 1

 

Open XCode and create a New Project. Choose iOS -> Single View App and click Next.

 

 

Step 2

 

Name your Project and save it in your desired location. Make sure you choose the language as Swift. Click on Create.

 

Step 3

 

Now, go to Main.storyboard. This is where we will design our UI. We see that a View Controller is already present in our Main.Storyboard. Delete the View Controller.

 

Step 4

 

Now, on the right hand side, you will find the Object Library. If you don’t find it, go to View -> Show Object Library.

 

Step 5

 

Drag and drop a Table View Controller from the Object Library. Go to the Attribute Inspector present on the right hand side, and check the ‘Is Initial View Controller’ option in the View Controller section.

 

 

Step 6

 

Now, go to File and add a new File in your project. Select ‘Cocoa Touch Class’ and click Next.

 

 

Step 7

 

Choose the Subclass as UITableViewController as we are using a Table View Controller in our UI. Here, I name my class as FruitsTableViewContoller. Click on Next. Click on Create.

 

 

Step 8

 

Now, go back to your Main.storyboard and click on the Table View Controller. On the right hand side, you will find the Identity Inspector. Here , we will assign the class for our Table View Controller. Select ‘FruitsTableViewController’ (name of the class that you have assigned to your Cocoa Touch Class) from the dropdown list.

 

 

Step 9

 

In the Table View Controller, you can see a Prototype cell. Click on the prototype cell and assign a name to the cell in the Identifier present in the Attribute Inspector under the Table View Cell section. I have named my prototype cell as ‘cell’.

 

 

Step 10

 

We are done with the UI part. Now, we need to write the code to display our list in the TableView. Copy paste the following code in the FruitsTableViewController file.

import UIKit
class FruitsTableViewController: UITableViewController {
        var listOfFruits = ["Apple", "Mango", "Grapes", "Pineapple", "Orange", "Banana"]
        // MARK: - Table view data source
        override func numberOfSections( in tableView: UITableView) - > Int {
            return 1
        }
        override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) - > Int {
            return listOfFruits.count
        }
        override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) - > UITableViewCell {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell",
                for: indexPath)
            cell.textLabel ? .text = listOfFruits[indexPath.row]
            return cell
        }

Step 11

 

Now, we are ready to run the Application. Run the application on the simulator/iPhone device and check if it works or not.

 

 

Some important tips

 

If you have followed the above steps properly, then you must get the output. In case your application does not run, recheck the following points,

• Check whether ‘is Initial View Controller’ option is checked in the Attribute Inspector if you have deleted the existing View Controller and replaced it with the new Table View Controller.
• Check if the class inside your Cocoa Touch file inherits from the UITableViewController.
• Check if you have assigned the proper class name to your Table View Controller in the Identity Inspector. (i.e FruitsTableViewController according to the above steps).
• Check if you have used the proper name in your code that you have assigned to your prototype cell, i.e in the Identifier of the Attribute Inspector.