[Swift通天遁地]二、表格表單-(1)創建自定義的UITableViewCell(單元格類)
阿新 • • 發佈:2018-12-26
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(單元格類)