学习 iOS 中 UITableView

iOS 中的列表对应的控件为 UITableView ，可以通过给 UITableView 设置数据源来显示不同的数据。结合 Android 开发给 RecyclerView 或者 ListView 显示数据的步骤:

  1. 界面中添加 ListView （xml）
  2. 代码中拿到 ListView 的引用（findViewById）
  3. 设置 ListView 的 item 的个数（一般为数据源的个数）
  4. 创建每个 item 的布局（xml）
  5. 设置 ListView 对应每个位置的 item 显示的内容（数据源的每一项）
  6. 刷新界面 adapter 的 notifyDataSetChanged()

iOS 使用 UITableView 的步骤：

  1. 界面中添加 UITableView （storyboard）
  2. 代码中拿到 UITableView 的引用 （按住 ctrl 拖动控件到代码中引用）
  3. 设置 UITableView 的 cell 的个数（一般为数据源的个数）
  4. 创建每个 item 的布局 （xib）
  5. 设置 UITableView 对应每个位置的 cell 显示的内容（数据源的每一项）
  6. 刷新界面 tableview 的 reloadData()

设置两个协议（类似于接口）：

  • UITableViewDataSource（data source），用于设置数据
  • UITableViewDelegate（delegate），用于处理 TableView 的交互（比如点击，添加、删除、移动，header、footer等）

有两个方法需要去实现：

1
2
3
4
5
6
7
// 每个section需要加载多少行，一般选择返回数据源的个数
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int{
}
 
// 返回 UITableViewCell，UITableViewCell 是 section 里的行（某一行或者所有行），根据 indexPath 来显示不同的内容到 Cell
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell{
}

代码：

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
//
//  ArticleListController.swift
//  AndroidDaily
//
//  Created by hanks on 16/4/17.
//  Copyright © 2016年 hanks. All rights reserved.
//

import UIKit

class ArticleListController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    var articleList = [Article]()
    var tableView : UITableView?
    
    override func viewDidLoad() {
        super.viewDidLoad()

        initView()
        initData()
        
        // Uncomment the following line to preserve selection between presentations
        // self.clearsSelectionOnViewWillAppear = false

        // Uncomment the following line to display an Edit button in the navigation bar for this view controller.
        // self.navigationItem.rightBarButtonItem = self.editButtonItem()
    }
    
    func initView() {
        // 初始化tableView的数据
        self.tableView=UITableView(frame:self.view.frame,style:UITableViewStyle.Plain)
        // 设置tableView的数据源
        self.tableView!.dataSource=self
        // 设置tableView的委托
        self.tableView!.delegate = self
        
        self.tableView!.registerNib(UINib(nibName: "ArticleCell",bundle: nil), forCellReuseIdentifier: "articleCell")
        
        self.tableView!.rowHeight = UITableViewAutomaticDimension // 自适应，注意需要 设置所以控件的 left, right, bottom, top 约束 才会生效

        self.tableView!.estimatedRowHeight = 110 //估算高度，提高性能

        self.view.addSubview(self.tableView!)
    }
    
    func initData() {
         
        let url = NSURL(string: "https://api.hanks.xyz/1.1/Articles?limit=30&order=-createdAt")! // url 瞎写的
        
        let requset = NSMutableURLRequest(URL: url)
        requset.allHTTPHeaderFields = headers
        
        NSURLConnection.sendAsynchronousRequest(requset, queue: NSOperationQueue()) { (_, data, e) -> Void in
            if e == nil {
                
                let json  = try? NSJSONSerialization
                    .JSONObjectWithData(data!, options:NSJSONReadingOptions.AllowFragments) as! NSDictionary
                
                let result = json?["results"] as! Array<Article> as NSArray
                
                for item in result {
                    let article = Article()
                    
                    article.title = item.valueForKey("title") as? String
                    article.subTitle = item.valueForKey("subtitle") as? String
                    article.authorName = item.valueForKey("author_name") as? String
                    self.articleList.append(article)
                }
                
                // UI 操作放在 UI 线程
                dispatch_async(dispatch_get_main_queue(), { 
                    self.tableView!.reloadData()
                })
            }
        }
    }


    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    // MARK: - Table view data source
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        // #warning Incomplete implementation, return the number of rows
        return articleList.count
    }
    
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView .dequeueReusableCellWithIdentifier("articleCell", forIndexPath: indexPath) as! ArticleCell
        cell.setData(articleList[indexPath.row])
        return cell;
    }
}

ArticleCell

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
//
//  ArticleCell.swift
//  AndroidDaily
//
//  Created by hanks on 16/4/20.
//  Copyright © 2016年 hanks. All rights reserved.
//

import UIKit

class ArticleCell: UITableViewCell {

    @IBOutlet weak var titleLabel: UILabel!
    @IBOutlet weak var authorLabel: UILabel!
    @IBOutlet weak var subtitleLabel: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }
    
    func setData(article:Article)  {
        titleLabel.text = article.title
        authorLabel.text = article.authorName 

        // 设置label 行高
        let text = subtitleLabel.attributedText
        let mas = NSMutableAttributedString(attributedString:text!)
        mas.replaceCharactersInRange(NSMakeRange(0, mas.string.utf16.count),
                                     withString: article.subTitle!)
        subtitleLabel.attributedText = mas
    }
}

文章来自： https://hanks.pub