再读斋

iOS开发之05常见表视图

分节表视图

步骤

  1. 创建一个iOS工程
  2. 删除storyboard中View Controller Scene 中的View Controller,再从对象库拖入一个Table View Controller到设计界面
  3. 打开Table View Controller属性检查器,勾选Is Initial View Controller选项,否则应用启动后是黑屏
  4. 将ViewController类的父类由UIViewController改为UITableViewController
  5. 打开View Controller的属性选择器在Class列表中选择ViewController
  6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议,不需要再注册

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
//
// ViewController.swift
// IndexTable
//
// Created by Michael on 2016/10/31.
// Copyright © 2016年 Michael. All rights reserved.
//
import UIKit
class ViewController: UITableViewController {
var datas: NSDictionary!
var groupNames:NSArray!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let path = Bundle.main.path(forResource: "team_dictionary", ofType: "plist")
self.datas = NSDictionary(contentsOfFile: path!)
let tempList = self.datas.allKeys as NSArray
//排序
let sortedArray = tempList.sortedArray(comparator: { (obj1, obj2) -> ComparisonResult in
let str1 = obj1 as! String
let str2 = obj2 as! String
let ret = str1.compare(str2)
return ret
})
self.groupNames = sortedArray as NSArray!
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
//组中条目的数量
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
let groupName = self.groupNames[section] as! String
let teams = self.datas[groupName] as! NSArray
return teams.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "liu",for: indexPath)
let section = indexPath.section
let row = indexPath.row
let groupName = self.groupNames[section] as! String
let teams = self.datas[groupName] as! NSArray
cell.textLabel?.text = teams[row] as? String
return cell
}
//组的数量
override func numberOfSections(in tableView: UITableView) -> Int {
return self.groupNames.count
}
//组的标题
override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
let name = self.groupNames[section] as! String
return name
}
//索引的标题
override func sectionIndexTitles(for tableView: UITableView) -> [String]? {
var titles = [String]()
for item in self.groupNames {
let title = item as! String
titles.append(title.substring(to: title.index(title.startIndex, offsetBy: 1)))
}
return titles
}
//点击事件
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
let section = indexPath.section
let row = indexPath.row
let groupName = self.groupNames[section] as! String
let teams = self.datas[groupName] as! NSArray
print(groupName)
print(teams[row])
}
}

示例

静态表视图

步骤

  1. 创建一个iOS工程,使用Table View Controller作为表视图控制器
  2. 选择Table View,打开属性检查器,从Content下拉列表中选择Static Cells,将Section的值为设为3.,从Style下拉列表中选择Grouped
  3. 选择第一个Table View Section,将Rows值设为2,即该节中包含两个单元格,分别拖入一个TextField到两个单元格中
  4. 选择第二个Table View Section,将Rows值设为1,拖入一个Button到单元格中
  5. 选择第二个Table View Section,将Rows值设为1,拖入一个Lable到单元格中

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
//
// ViewController.swift
// StaticTable
//
// Created by Michael on 2016/11/2.
// Copyright © 2016年 Michael. All rights reserved.
//
import UIKit
class ViewController: UITableViewController {
@IBOutlet weak var mUserName: UITextField!
@IBOutlet weak var mPwd: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
@IBAction func login(_ sender: UIButton) {
if self.mUserName.text == "liu" && self.mPwd.text == "123" {
NSLog("login sucess");
mUserName.resignFirstResponder();
mPwd.resignFirstResponder();
}
}
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
NSLog("Section: %d,Row: %d",indexPath.section,indexPath.row);
}
}

示例

插入和删除单元格

步骤

  1. 创建一个iOS工程
  2. 删除storyboard中View Controller Scene 中的View Controller,再从对象库拖入一个Navigation Controller到设计界面,同时也会添加一个Table View Controller到设计界面
  3. 打开Table View Controller属性检查器,勾选Is Initial View Controller选项,否则应用启动后是黑屏
  4. 将ViewController类的父类由UIViewController改为UITableViewController
  5. 打开View Controller的属性选择器在Class列表中选择ViewController
  6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议,不需要再注册

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
//
// ViewController.swift
// DeleteAddCell
//
// Created by Michael on 2016/11/2.
// Copyright © 2016年 Michael. All rights reserved.
//
import UIKit
class ViewController: UITableViewController {
var txtField:UITextField!
var listTeams: NSMutableArray!
override func viewDidLoad() {
super.viewDidLoad()
//设置导航栏
self.navigationItem.rightBarButtonItem = self.editButtonItem
self.navigationItem.title = "单元格插入和删除"
self.txtField = UITextField()
self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
//响应视图编辑状态
override func setEditing(_ editing: Bool, animated: Bool) {
super.setEditing(editing, animated: animated)
self.tableView.setEditing(editing, animated: true)
if editing {
self.txtField.isHidden = false
} else{
self.txtField.isHidden = true
}
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.listTeams.count + 1
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let isAddCell = (indexPath.row == self.listTeams.count)
let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "CustomCell", for: indexPath)
if !isAddCell {
cell.accessoryType = .disclosureIndicator
cell.textLabel?.text = self.listTeams[indexPath.row] as? String
} else {
self.txtField.frame = CGRect(x: 40, y: 0, width: 300, height: cell.frame.size.height)
self.txtField.borderStyle = .none
self.txtField.placeholder = "Add..."
self.txtField.text = ""
cell.addSubview(self.txtField)
}
return cell
}
//返回编辑样式
override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
if indexPath.row == self.listTeams.count {
return .insert
} else {
return .delete
}
}
//添加删除时调用
override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
if editingStyle == .delete {
self.listTeams.removeObject(at: indexPath.row)
self.tableView.deleteRows(at: [indexPath], with: .fade)
} else if editingStyle == .insert {
self.listTeams.insert(self.txtField.text!, at: self.listTeams.count)
self.tableView.insertRows(at: [indexPath], with: .fade)
}
self.tableView.reloadData();
}
}

示例

移动单元格

步骤

1
2
3
4
5
6
1. 创建一个iOS工程
2. 删除storyboard中View Controller Scene 中的View Controller,再从对象库拖入一个Navigation Controller到设计界面,同时也会添加一个Table View Controller到设计界面
3. 打开Table View Controller属性检查器,勾选Is Initial View Controller选项,否则应用启动后是黑屏
4. 将ViewController类的父类由UIViewController改为UITableViewController
5. 打开View Controller的属性选择器在Class列表中选择ViewController
6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议,不需要再注册

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
//
// ViewController.swift
// MoveCell
//
// Created by Michael on 2016/11/2.
// Copyright © 2016年 Michael. All rights reserved.
//
import UIKit
class ViewController: UITableViewController {
var listTeams: NSMutableArray!
override func viewDidLoad() {
super.viewDidLoad()
//设置导航栏
self.navigationItem.rightBarButtonItem = self.editButtonItem
self.navigationItem.title = "单元格移动"
self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
//响应视图编辑状态
override func setEditing(_ editing: Bool, animated: Bool) {
super.setEditing(editing, animated: animated)
self.tableView.setEditing(editing, animated: true)
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.listTeams.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "MoveCell", for: indexPath)
cell.accessoryType = .disclosureIndicator
cell.textLabel?.text = self.listTeams[indexPath.row] as? String
return cell
}
//返回true表示可以移动
override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
return true
}
//移动单元格时触发此方法
override func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
let mode = self.listTeams[sourceIndexPath.row] as! String
self.listTeams.removeObject(at: sourceIndexPath.row)
self.listTeams.insert(mode, at: destinationIndexPath.row)
}
//编辑的样式
override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
return .delete
}
override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
if editingStyle == .delete {
self.listTeams.removeObject(at: indexPath.row)
self.tableView.deleteRows(at: [indexPath], with: .fade)
} else if editingStyle == .insert {
self.tableView.insertRows(at: [indexPath], with: .fade)
}
self.tableView.reloadData();
}
}

示例

下拉刷新

步骤

  1. 创建一个iOS工程
  2. 删除storyboard中View Controller Scene 中的View Controller,再从对象库拖入一个Table View Controller到设计界面
  3. 打开Table View Controller属性检查器,勾选Is Initial View Controller选项,否则应用启动后是黑屏
  4. 将ViewController类的父类由UIViewController改为UITableViewController
  5. 打开View Controller的属性选择器在Class列表中选择ViewController
  6. UITableViewController默认以注册UITableViewDataSource和UITableViewDelegate协议,不需要再注册

代码实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
//
// ViewController.swift
// RefreshCell
//
// Created by Michael on 2016/11/7.
// Copyright © 2016年 Michael. All rights reserved.
//
import UIKit
class ViewController: UITableViewController {
var listTeams: NSMutableArray!
override func viewDidLoad() {
super.viewDidLoad()
//设置导航栏
self.navigationItem.rightBarButtonItem = self.editButtonItem
self.navigationItem.title = "单元格移动"
let rc = UIRefreshControl()
rc.attributedTitle = NSAttributedString(string: "下拉刷新")
rc.addTarget(self, action: #selector(ViewController.refresh), for: .valueChanged)
self.refreshControl = rc
self.listTeams = NSMutableArray(array: ["黑龙江","吉林","辽宁","北京"])
}
func refresh() {
NSLog("refresh")
if (self.refreshControl?.isRefreshing)! {
self.refreshControl?.attributedTitle = NSAttributedString(string: "加载中")
listTeams.add("上海")
listTeams.add("天津")
self.refreshControl?.endRefreshing()
self.refreshControl?.attributedTitle = NSAttributedString(string: "下拉刷新")
}
self.tableView.reloadData()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
//响应视图编辑状态
override func setEditing(_ editing: Bool, animated: Bool) {
super.setEditing(editing, animated: animated)
self.tableView.setEditing(editing, animated: true)
}
override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return self.listTeams.count
}
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell:UITableViewCell! = tableView.dequeueReusableCell(withIdentifier: "RefreshCell", for: indexPath)
cell.accessoryType = .disclosureIndicator
cell.textLabel?.text = self.listTeams[indexPath.row] as? String
return cell
}
//返回true表示可以移动
override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
return true
}
//移动单元格时触发此方法
override func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
let mode = self.listTeams[sourceIndexPath.row] as! String
self.listTeams.removeObject(at: sourceIndexPath.row)
self.listTeams.insert(mode, at: destinationIndexPath.row)
}
//编辑的样式
override func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) -> UITableViewCellEditingStyle {
return .delete
}
override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {
if editingStyle == .delete {
self.listTeams.removeObject(at: indexPath.row)
self.tableView.deleteRows(at: [indexPath], with: .fade)
} else if editingStyle == .insert {
self.tableView.insertRows(at: [indexPath], with: .fade)
}
self.tableView.reloadData();
}
}

示例

刘涤生 wechat