iOS Custom TableView With Images and Checkmarks With Examples

In this tutorial, we’ll be developing an iOS Application that contains a custom TableView with cells having a custom layout inclusive of images, label and a checkmark. Let’s create a new SingleView Application project and get on with it.

iOS Custom TableView Project Structure



The project consists of a ViewController.swift class file which would hold the class for CustomTableViewCells too. Also, the images that we would be displaying shall be present in the Assets folder.

Building Storyboards for iOS TableView

  1. Adding a TableView and setting its constraints.ios custom tableview example
  2. Adding a TableViewCell and an ImageView in the cell and setting its constraints.
  3. Adding a label between the ImageView and the AccessoryType – checkmark and setting its constraints.
  4. The ViewController.swift would contain another class CustomCell that implements the UITableViewCell protocol as shown below.
  5. Let’s link these classes with the storyboard.

iOS Custom TableView Example Code

The code for the ViewController.swift file is given below.

In the above code, we set the label and image from the labelData and imageData arrays respectively.
To check/uncheck a cell, we check the accessoryType attribute on the cell. If it’s equal to checkmark we toggle it to none and vice versa.

The output for the above application in action is given below.

In case we want to allow single choice selection only we can use the below code:

In the above code, we override the functions didSelectRowAt as well as didDeselectRowAt to allow single choice selection. We can’t use tableView.deselectRow(at: indexPath, animated: true) to animate the selection anymore since that method is already being overridden. Hence we set the selectionStyle in the customCell as none:

The output of the above implementation is given below:

This brings an end to this tutorial. You can download the final iOS CustomTableViewWithImagesAndCheckMarks Project from the link below.

Reference: iOS Table View

By admin

Leave a Reply

%d bloggers like this: