Friday, February 10, 2017
How to Create TableView Example Using Swift Language
Create a new project
Open Xcode 6, create a new “Single Page Application” and select Swift as the programming language.
Add a table view property
Open the
ViewController.swift
class and add a new tableview instance variable below the class declaration. @IBOutlet
var tableView: UITableView!
The @IBOutlet attribute makes the
tableView
property visible in Interface Builder.Conform to the TableView Delegate and DataSource protocols
To conform to the
UITableViewDelegate
and UITableViewDataSource
protocol just add them seperated by colons afterUIViewController
in the class declaration. This was a bit confusing at first but the new protocol syntax is cleaner.class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
}
After that we need to implement the
tableView(_:numberOfRowsInSection:)
, tableView(_:cellForRowAtIndexPath:)
andtableView(_:didSelectRowAtIndexPath:)
methods in the ViewController
class and leave them empty for nowclass ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 0
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
return UITableViewCell()
}
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
}
}
Add a table view in your view controller
Search in the componet library(It should be in the lower right corener) for Table View and then drag and drop it on the view.
Connect the Interface Builder Outlets
Connect the referencing, dataSource and delegate outlets.
We can connect the respective outlets using interface builder by right clicking on the table view and dragging each outlet on the view controller.
Register the cell class
In the viewDidLoad method call the
registerClass(_:forCellReuseIdentifier:)
. Tip: to get the class use the class name followed by .selfclass ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
override func viewDidLoad() {
super.viewDidLoad()
self.tableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "cell")
}
...
}
Add some data to display
Add a property called items as an Array of Strings and set some values
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
var items: [String] = ["We", "Heart", "Swift"]
...
}
Set the number of rows
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.items.count;
}
...
}
Create the cell
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
var cell:UITableViewCell = self.tableView.dequeueReusableCellWithIdentifier("cell") as UITableViewCell
cell.textLabel?.text = self.items[indexPath.row]
return cell
}
...
}
Handle cell selection
Another new thing in Swift is String Interpolation that let’s you add arbitrary code inside a string.
Some examples:
var one = "\(1)" // "1"
var two = "\(1 + 1)" // "2"
var name = "Andrei Puni"
println("my name is \(name) and I heart Swift") // will print "my name is Andrei Puni and I heart Swift"
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
...
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
println("You selected cell #\(indexPath.row)!")
}
...
}
By now your ViewController class should look like this:
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource
{
@IBOutlet
var tableView: UITableView
var items: [String] = ["I", "Love", "Swift"]
override func viewDidLoad() {
super.viewDidLoad()
self.tableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "cell")
}
//MARK:- TABLE VIEW METHODS
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.items.count;
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
var cell:UITableViewCell = self.tableView.dequeueReusableCellWithIdentifier("cell") as UITableViewCell
cell.textLabel?.text = self.items[indexPath.row]
return cell
}
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
print("I selected cell #\(indexPath.row)!")
}
}
If you haven’t skipped any steps you should be able to run the app and see something similar to:
TableView Without Custom cell Source Code :
import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource
{
@IBOutlet var tableView: UITableView!
var items: [String] = ["I", "Love", "Swift"]
override func viewDidLoad()
{
super.viewDidLoad()
self.tableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: "cell")
}
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int
{
return self.items.count;
}
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
{
var cell:UITableViewCell = self.tableView.dequeueReusableCellWithIdentifier("cell") as UITableViewCell
cell.textLabel?.text = self.items[indexPath.row]
return cell
}
func tableView(tableView: UITableView!, didSelectRowAtIndexPath indexPath: NSIndexPath!)
{
print("I selected cell #\(indexPath.row)!")
}
}
Subscribe to:
Post Comments
(
Atom
)
No comments :
Post a Comment