iPhone
TableView
cell accessory
Swift
iOS development

Adding the little arrow to the right side of a cell in an iPhone TableView Cell

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions

Introduction

The small arrow on the right side of a UITableViewCell is the standard disclosure indicator. In UIKit, you do not need to draw it yourself or add a custom image in the common case. The built-in accessory API already provides the native look, alignment, and behavior users expect for a row that leads to another screen.

Use the Built-In Accessory Type

The simplest solution is to set the cell's accessoryType to .disclosureIndicator when you configure the row.

swift
1import UIKit
2
3final class SettingsViewController: UITableViewController {
4    private let items = ["Profile", "Notifications", "Privacy"]
5
6    override func viewDidLoad() {
7        super.viewDidLoad()
8        tableView.register(UITableViewCell.self, forCellReuseIdentifier: "Cell")
9    }
10
11    override func tableView(
12        _ tableView: UITableView,
13        cellForRowAt indexPath: IndexPath
14    ) -> UITableViewCell {
15        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
16
17        var content = cell.defaultContentConfiguration()
18        content.text = items[indexPath.row]
19        cell.contentConfiguration = content
20
21        cell.accessoryType = .disclosureIndicator
22        return cell
23    }
24}

That is the standard UIKit answer. The framework renders the arrow for you and keeps it consistent with the rest of the platform.

Make Sure the Row Actually Does Something

The disclosure indicator is only a visual cue. It suggests that tapping the row navigates deeper or reveals more detail. If the row does nothing, the accessory becomes misleading.

swift
1override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
2    tableView.deselectRow(at: indexPath, animated: true)
3
4    let detail = UIViewController()
5    detail.view.backgroundColor = .systemBackground
6    detail.title = items[indexPath.row]
7
8    navigationController?.pushViewController(detail, animated: true)
9}

The UI convention matters here. A disclosure indicator should match real drill-down behavior.

Reuse Means You Must Configure Every Cell

Because table view cells are reused, accessory state must be set every time a cell is configured. If some rows should show an arrow and others should not, assign the accessory type on every path through cellForRowAt.

swift
1override func tableView(
2    _ tableView: UITableView,
3    cellForRowAt indexPath: IndexPath
4) -> UITableViewCell {
5    let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
6
7    cell.textLabel?.text = items[indexPath.row]
8    cell.accessoryType = indexPath.row == 0 ? .disclosureIndicator : .none
9
10    return cell
11}

If you only set it for one branch, reused cells can carry the arrow into rows that should not have it.

Storyboards and Interface Builder

If you use storyboards, you can also set the accessory visually.

  1. Select the table view cell.
  2. Open the Attributes Inspector.
  3. Set Accessory to Disclosure Indicator.

This is convenient for static cells or quick prototypes. For dynamic cells, many teams still prefer code because it keeps visual behavior near the data and selection logic.

When to Use accessoryView Instead

The built-in disclosure indicator is ideal for standard navigation. Use accessoryView only when you truly need a custom trailing control such as a switch, badge, spinner, or branded icon.

swift
let imageView = UIImageView(image: UIImage(systemName: "chevron.right"))
imageView.tintColor = .systemGray3
cell.accessoryView = imageView

That works, but it also makes you responsible for sizing, tint, alignment, and future visual consistency. If all you want is the normal arrow, the built-in accessory remains the better choice.

Choose the Right Accessory for the Meaning

Not every row should use a disclosure indicator. UIKit offers several accessories because each one communicates a different kind of interaction.

  • '.disclosureIndicator usually means navigation'
  • '.detailButton suggests extra info'
  • '.checkmark shows selection state'
  • '.none means no accessory'

Picking the correct accessory keeps the table view easy to understand without extra explanation text.

Common Pitfalls

  • Adding a custom image for the arrow when the built-in disclosure indicator would have been simpler and more consistent.
  • Showing a disclosure indicator on a row that does not actually navigate anywhere.
  • Forgetting to reset accessoryType during cell reuse, which leaves arrows on the wrong rows.
  • Manually placing subviews inside the cell instead of using accessoryType or accessoryView.
  • Leaving the row selected after tap, which makes the interaction feel unfinished.

Summary

  • The standard right-side arrow in a table view cell is the disclosure indicator.
  • Add it with cell.accessoryType = .disclosureIndicator.
  • The visual cue should match real navigation behavior in didSelectRowAt.
  • Because cells are reused, accessory state must be configured every time.
  • Use accessoryView only when you need custom trailing content beyond the native arrow.

Related reading
Free course
Beginner
7 lessons
2 hours
Tackling System Design Interview Problems

A short course that equips you with the skills to approach system design interviews methodically.

Start the free course
Track what you have practised

A free account saves your progress, solutions and study plan across every problem on Codemia.

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions