動態添加一個自定義的UITableViewCell

Question

我想創建一個列表（的UITableView）與由三個標籤這需要用戶的數據customview（UITableViewCell中），讓說名字和姓氏，部門，當你點擊添加按鈕（名單之外），新的用戶自定義視圖被添加到列表中，您可以在其中輸入另一個用戶詳細信息。 我知道如何在tableView中創建一個自定義視圖 我知道如何附加到一個tableView，如果它只是一個文本，但我想追加到tableview是一個customView點擊一個按鈕。

要添加一個文本到tableView，我做了類似下面的東西。

datas.insert("new data", at: 0) 
     jobTableView.beginUpdates() 
     jobTableView.insertRows(at: [IndexPath.init(row: 0, section: 0)], with: .automatic) 
     jobTableView.endUpdates() 

如何爲customView做？

下面是我的tableview

UITableviewClass

public class MiddlePartCell: BaseCell, UITableViewDelegate, UITableViewDataSource { 

let tableCell = "tableCell" 

lazy var jobTableView: UITableView = { 
    let tv = UITableView() 
    tv.backgroundColor = .brown 
    tv.dataSource = self 
    tv.delegate = self 
    return tv 
}() 

lazy var addMoreButton: UIButton = { 
    let button = UIButton(type: .system) 
    button.setBackgroundImage(UIImage(named: "plus"), for: .normal) 
    button.tintColor = .black 
    button.addTarget(self, action: #selector(handleAddJob), for: .touchUpInside) 
    button.layer.cornerRadius = 20 
    return button 
}() 

@objc private func handleAddJob(){ 
    //what should i do here 
    //i need to insert the custom view to the top index 
    jobTableView.beginUpdates() 
    jobTableView.insertRows(at: [IndexPath.init(row: 0, section: 0)], with: .automatic) 
    jobTableView.endUpdates() 
} 

override func setupView() { 
    super.setupView() 
    backgroundColor = .green 
    addSubview(jobTableView) 
    addSubview(addMoreButton) 

    jobTableView.register(UITableViewCell.self, forCellReuseIdentifier: tableCell) 

    _ = addMoreButton.anchor(nil, left: leftAnchor, bottom: bottomAnchor, right: nil, topConstant: 0, leftConstant: 10, bottomConstant: 10, rightConstant: 0, widthConstant: 50, heightConstant: 50) 

    _ = jobTableView.anchor(topAnchor, left: leftAnchor, bottom: addMoreButton.topAnchor, right: rightAnchor, topConstant: 0, leftConstant: 0, bottomConstant: 0, rightConstant: 0, widthConstant: frame.width, heightConstant: frame.height) 
} 

public func numberOfSections(in tableView: UITableView) -> Int { 
    return 1 
} 

public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 
    let cell = tableView.dequeueReusableCell(withIdentifier: tableCell, for: indexPath) 

    cell.textLabel?.text = datas[indexPath.item] 

    return cell 
} 

public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { 
    return datas.count 
    } 
} 

Answer 1

首先，你必須子類的UITableViewCell用的UITextField一個UITableViewCell。當然你可以在cellForRowAt委託函數中添加UITextField，但我更喜歡用自定義的UITableViewCell來完成。

class UITableViewCellWithTextField: UITableViewCell { 

    var textField: UITextField! 

    override init(style: UITableViewCellStyle, reuseIdentifier: String?) { 

     super.init(style: style, reuseIdentifier: reuseIdentifier) 
     setup() 
    } 

    func setup() { 

     let textField = UITextField(frame: self.contentView.frame) 
     self.contentView.addSubview(self.textField) 
    } 
} 

接下來，您必須將此自定義UITableViewCell註冊到您的UITableView中。將此添加到您現有的UITableViewCell註冊代碼行中。

jobTableView.register(UITableViewCell.self, forCellReuseIdentifier: tableCell) 
jobTableView.register(UITableViewCellWithTextField.self, forCellReuseIdentifier: "TextFieldCell") 

下一步是聲明一個變量來表明用戶已經啓動了添加新的作業功能。

public class MiddlePartCell: BaseCell, UITableViewDelegate, UITableViewDataSource { 

    var isHandlingAddJob = false 

    ... 
} 

然後在你的handleAddJob功能

func handleAddJob(){ 

    self.isHandlingAddJob = true 
    datas.insert("new data", at: 0) 
    jobTableView.beginUpdates() 
    jobTableView.insertRows(at: [IndexPath.init(row: 0, section: 0)], with: .automatic) 
    jobTableView.endUpdates() 
} 

最後是讓的UITableView知道，進入新的細胞來處理增加了新的工作，並應使用自定義的文本字段細胞。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 

    if indexPath.row == 0 && self.isHandlingAddJob { 

     // Handling new job cell 
     let cell = tableView.dequeueReusableCell(withIdentifier: "TextFieldCell", for: indexPath) as! UITableViewCellWithTextField 
     return cell 
    } 

    let cell = tableView.dequeueReusableCell(withIdentifier: tableCell, for: indexPath) 

    cell.textLabel?.text = datas[indexPath.item] 
    return cell 
} 

P.S.希望我正確理解你的問題大聲笑。

要堅持自定義表視圖單元格中的文本字段的數據，你必須使用委託模式。首先，您必須將您的自定義表格視圖單元格或MiddlePartCell類別與UITextFieldDelegate相符。我會爲後者而努力。

class MiddlePartCell: BaseCell, UITableViewDelegate, UITableViewDataSource, UITextFieldDelegate { 

    ... 
} 

然後在你的cellForRowAt功能，將您的自定義單元格的文本字段委託設置爲您MiddlePartCell。

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 

    if indexPath.row == 0 && self.isHandlingAddJob { 

     // Handling new job cell 
     let cell = tableView.dequeueReusableCell(withIdentifier: "TextFieldCell", for: indexPath) as! UITableViewCellWithTextField 
     cell.returnKeyType = .Done 
     cell.textField.delegate = self 
     return cell 
    } 

    ... 
} 

最後，使用UITextFieldDelegate函數。當在鍵盤上完成使用單擊時，您的單元格將被重新加載爲沒有UITextField的普通UITableViewCell。

func textFieldShouldReturn(textField: UITextField) -> Bool { 

    self.isHandlingAddJob = false 
    self.datas.first! = textField.text! 
    self.jobTableView.reloadRowsAtIndexPaths([NSIndexPath(forRow: 0, inSection: 0)], withRowAnimation: .Automatic) 
    return true 
}