Reordering Rows from Table View in iOS8 with Swift

The Table View Controller has an editing mode, when enabled the rows can be reordered by dragging the cells up/down. In this tutorial we will fill the Table View with some data and put the Table View Controller in editing mode. This tutorial is built in iOS 8.1 and Xcode 6.1.

Open Xcode and create a new Single View Application. For product name, use IOS8SwiftReorderingRowsTutorial and then fill out the Organization Name and Organization Identifier with your customary values. Enter Swift as Language and make sure only iPhone is selected in Devices.

Remove the View Controller from the Storyboard and drag a Navigation Controller to the empty canvas. When the initial View Controller is deleted there isn't a starting point defined. Select the Navigation Controller and go to the Attribute Inspector. In the View Controller Section  elect the "Is Initial View Controller" checkbox.

Double-click on the Navigation Bar in The Table View Controller and set the title to "Numbers".  Select the Table View Cell and go to the Attributes Inspector. In the Table View Cell section set the Identifier  to "Cell".

The Storyboard should look like this.

Since we have deleted the View Controller from the Storyboard we can also delete the ViewController.swift file. Add a new file to the project, select iOS->Source->Cocoa Touch Class. Name it TableViewController and make it a subclass of UITableViewController.

Go to the TabelViewController.swift file and add the following property

var tableData = ["One","Two","Three","Four","Five"]

In the TableViewController class some methods are already implemented and only needs some minor changes. Change the following methods

override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        // Return the number of sections.
        return 1

    override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        // Return the number of rows in the section.
        return tableData.count

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as! UITableViewCell

        // Configure the cell...
        cell.textLabel.text = tableData[indexPath.row]

        return cell
  1. Only 1 section is used

  2. The number of rows is equals to the number of items in our array

  3. For each row we assign the value of the array's item to the text label of the cell

Go to the Storyboard and Select the Table View Controller. Go to the Identity Inspector and in the Custom Class section change the class to TableViewController

Build and Run the project, the Numbers should be displayed inside the Table View.

To reorder the rows in a Table View we have to make sure our Table View is in editing mode. Go to the Main.Storyboard and add a Bar Button Item to the right of the Navigation Bar of the Table View Controller. Select the Bar button item and in the Property inspector in the Identifier field change it to Edit.

Open The Assistant Editor and make sure the TableViewController.swift file is visible. Ctrl And Drag from the Bar Button Item  to the TableViewController class and create the following Action

Implement the startEditing method

@IBAction func startEditing(sender: UIBarButtonItem) {
      self.editing = !self.editing

The Table View Controller has an editing property to set the Table View into editing mode.  While in editing mode the table view rows can be reordered. Pressing there Edit button will toggle the editing mode. The tableView has 2 delegate methods which are needed to control the movement of our rows. First create the following method so all rows can be moved.

override func tableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath) -> Bool {
      return true}

In the tableView:moveRowAtIndexPath:toIndexPath we will reorder the items in our tableData array.

override func tableView(tableView: UITableView, moveRowAtIndexPath fromIndexPath: NSIndexPath, toIndexPath: NSIndexPath) {
      var itemToMove = tableData[fromIndexPath.row]
      tableData.insert(itemToMove, atIndex: toIndexPath.row)

Build and Run and reorder the rows in our table view.

You can download the source code of the IOS8SwiftReorderingRowsTutorial at the ioscreator repository on Github.