How to delete & reorder rows uitableview in iOS Swift

 

This tutorial has been updated for X code 7.3 & swift 2.2

  1. First lets set up the x code project as usual. Create new single view application X code project. Set project name to tableview reorder demo & save it on desktop.

 

new x code project

2. Go to main storyboard & select view controller & delete it. Add tableview controller in main storyboard.

add table view controller

 

3. Select navigation controller & make it initial view controller

set initial view controller

 

4. Now delete view controller swift file & add new cocoa touch class file of class uitableviewcontroller

add table view controller swift file

 

5. Go to main storyboard; select table view controller & set its class to TableViewController

set custom class

 

6. Select table view controller & go to Editor -> Embed In -> navigation controller & set its title to Table reorder

navigation title

 

7. Add bar button item to navigation bar & set its title to Edit

edit bar button item

 

8. Now select the prototype cell. Set its identifier to tableCell. Also set style to Basic

prototype cell identifier

 

9. Now create an array called tableData to save row content of tableview

class TableViewController: UITableViewController {
var tableData = ["one", "two", "three", "four", "five"]

10. Now set number of sections to 1 & number of rows to number.count.

override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
    // #warning Potentially incomplete method implementation.
    // Return the number of sections.
    return 1
}

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

11. Uncomment cellForRowAtIndexPath method & add following code

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

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

    return cell
}

12. Uncomment moveRowAtIndexpath method & add following code

// Override to support rearranging the table view.
override func tableView(tableView: UITableView, moveRowAtIndexPath fromIndexPath: NSIndexPath, toIndexPath: NSIndexPath) {
    var itemToMove = tableData[fromIndexPath.row]
    tableData.removeAtIndex(fromIndexPath.row)
    tableData.insert(itemToMove, atIndex: toIndexPath.row)

}

13. Uncomment canMoveRowAtIndexPath method as following

// Override to support conditional rearranging of the table view.
override func tableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath) -> Bool {
    // Return NO if you do not want the item to be re-orderable.
    return true
}

14. Connect Edit button to swift file

bar button item to swift file

15. Add following code to editing button

@IBAction func editing(sender: UIBarButtonItem) {

    self.editing = !self.editing

}

Now build and run app in iPhone 5s. Click on edit button & reorder the rows.

reorder tableview rows
Download X code file
Challenge: Remove rows from table when pressed on delete button

reorder & delte tableview rows
Download Challenge Solution

Total 8 Votes
4

Tell us how can I improve this tutorial?

+ = Verify Human or Spambot ?