1. 程式人生 > >[Swift通天遁地]二、表格表單-(1)創建自定義的UITableViewCell(單元格類)

[Swift通天遁地]二、表格表單-(1)創建自定義的UITableViewCell(單元格類)

pre bound tex 右鍵菜單 cells nib 控件綁定 根視圖 thumbnail

本文將演示如何在表單視圖中,添加一個自定義的單元格類。

首先創建一個自定義的單元格類。

在項目文件夾【DemoApp】上點擊鼠標右鍵,彈出右鍵菜單。

【New File】->【Cocoa Touch Class】->【Next】->

【Class】:CustomizeUITableViewCell ,類名。

【Subclass of】:UITableViewCell ,父類

【Language】:Swift

->【Next】->【Create】

在項目導航區,打開剛剛創建的代碼文件【CustomizeUITableViewCell.swift】

現在開始編寫代碼,往自定義單元格中,添加一些控件。

 1 import UIKit
 2 
 3 class CustomizeUITableViewCell: UITableViewCell
 4 {
 5     //該單元格擁有三個子元素,分別是:
 6     //1.左側的縮略圖
 7     var thumbnail : UIImageView!
 8     //2.中間的標題
 9     var title : UILabel!
10     //3.右側的細節按鈕
11     var detail : UIButton!
12     
13     //重寫單元格的自定義方法,在該方法中對單元格進行自定義操作
14 override init(style: UITableViewCellStyle, reuseIdentifier: String?) 15 { 16 //首先實現父類的初始化方法 17 super.init(style: style, reuseIdentifier: reuseIdentifier); 18 19 //初始化縮略圖對象,用來顯示項目中的一張圖片 20 self.thumbnail = UIImageView(image: UIImage(named: "user"
)) 21 //設置縮略圖在單元格中的顯示區域,位於單元格的左側 22 self.thumbnail.frame = CGRect(x: 20, y: 10, width: 24, height: 24) 23 24 //初始化標題標簽,並設置該標簽的顯示區域 25 self.title = UILabel(frame: CGRect(x: 80, y: 0, width: 120, height: 44)) 26 //設置標簽的文字內容 27 self.title.text = "" 28 //設置標簽字體的外觀屬性 29 self.title.font = UIFont(name: "Arial", size: 15) 30 31 //初始化細節按鈕控件,並設置按鈕的顯示區域,位於單元格的右側 32 self.detail = UIButton(frame: CGRect(x: 240, y: 12, width: 60, height: 20)) 33 //設置按鈕在正常狀態下的標題文字 34 self.detail.setTitle("Detail", for: UIControlState()) 35 //設置按鈕標題文字的字體屬性 36 self.detail.titleLabel?.font = UIFont(name: "Arial", size: 13) 37 //設置按鈕的背景顏色為橙色 38 self.detail.backgroundColor = UIColor.orange 39 //設置按鈕的層的圓角半徑為10,從而創建一個圓角按鈕。 40 self.detail.layer.cornerRadius = 10 41 //給按鈕控件綁定點擊事件 42 self.detail.addTarget(self, action: #selector(CustomizeUITableViewCell.showDetail(_:)), for: UIControlEvents.touchUpInside) 43 44 //依次將三個控件添加到單元格中 45 self.addSubview(self.thumbnail) 46 self.addSubview(self.title) 47 self.addSubview(self.detail) 48 } 49 50 //添加一個方法,用來響應細節按鈕的點擊事件 51 func showDetail(_ sender:UIButton) 52 { 53 print("Detail Informaiton.") 54 } 55 56 //添加一個必須實現的初始化方法 57 required init(coder aDecoder: NSCoder) 58 { 59 fatalError("init(code:)has not brrn implomented"); 60 } 61 }

在項目導航區,打開視圖控制器的代碼文件【ViewController.swift】

現在開始創建一個表格,並在表格中使用剛剛創建的單元格。

 1 import UIKit
 2 
 3 //使當前的視圖控制器類,遵循表格的數據源協議UITableViewDataSource
 4 class ViewController: UIViewController, UITableViewDataSource {
 5 
 6     override func viewDidLoad() {
 7         super.viewDidLoad()
 8         // Do any additional setup after loading the view, typically from a nib.
 9         
10         //獲得設備的屏幕尺寸
11         let screenRect = UIScreen.main.bounds
12         //創建一個矩形區域,作為表格視圖的顯示區域。
13         let tableRect = CGRect(x: 0, y: 20, width: screenRect.size.width, height: screenRect.size.height - 20)
14         //初始化一個指定顯示區域的表格對象
15         let tableView = UITableView(frame: tableRect)
16         
17         //設置表格對象的數據源為當前的視圖控制器對象
18         tableView.dataSource = self
19         //並將表格視圖添加到當前的視圖控制器的根視圖中
20         self.view.addSubview(tableView)
21     }
22     
23     //添加一個代理方法,用來設置表格的行數
24     func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
25     {
26         //在此設置表格擁有20個單元格
27         return 20
28     }
29     
30     //添加一個代理方法,用來初始化或復用表格中的單元格
31     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
32     {
33         //創建一個字符串常量,作為單元格的復用標識
34         let identifier = "reusedCell"
35         //根據復用標識從表格中獲取可以復用的單元格
36         var cell:CustomizeUITableViewCell? = tableView.dequeueReusableCell(withIdentifier: identifier) as? CustomizeUITableViewCell
37         
38         //如果沒有可以復用的單元格
39         if(cell == nil)
40         {
41             //則初始化一個自定義的單元格,並設置單元格的復用標識。
42             cell = CustomizeUITableViewCell(style: UITableViewCellStyle.default, 
43                                             reuseIdentifier: identifier)
44         }
45         
46         //設置自定義單元格的標題文字
47         //當然也可以設置單元格的縮略圖和細節按鈕的相關屬性
48         cell?.title?.text = "User Name"
49         return cell!
50     }
51     
52     override func didReceiveMemoryWarning() {
53         super.didReceiveMemoryWarning()
54         // Dispose of any resources that can be recreated.
55     }
56 }

[Swift通天遁地]二、表格表單-(1)創建自定義的UITableViewCell(單元格類)