通過在tableView單元格內單擊按鈕顯示隱藏標簽（展開/折疊單元格）

我有一個包含標簽的stackView(vertical)，默認情況下隱藏底部描述標簽。我在單元格的右側實作了一個箭頭按鈕。通過單擊按鈕，我只想顯示隱藏的描述標簽，stackView 應該自動展開并使單元格更大。這是我實作可擴展單元的基本想法。所以這是我用來獲得所需結果的代碼：

@objc func downArrowButtonClicked(_ sender: UIButton){
        let indexPath = IndexPath(row: sender.tag, section: 0)
        selectedIndex = indexPath
        selectedCellIndex = sender.tag
        isDescHidden = !isDescHidden
        tableView.reloadRows(at: [indexPath], with: .automatic)
    }

以上是單擊單元格內按鈕的代碼。我想到了重新加載該特定索引的想法。我創建了一個名為selectedCellIndexof 的變數，我在其中使用 incellForRowAt方法進行一些更改。

我還在 viewDidLayoutSubviews() 中實作了一些代碼，因為當我第一次單擊單元格時，它并沒有完全展開。這是以防萬一：

 override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        let indexPath = selectedIndex
        tableView.reloadRows(at: [indexPath ?? IndexPath(row: 0, section: 0)], with: .automatic)
    }

willDisplay并在最終解決單元擴展問題的方法中呼叫它：

func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
        viewDidLayoutSubviews()
    }

這是我的cellForRowAt功能：

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "CustomTableViewCell", for: indexPath) as! CustomTableViewCell
            
            if indexPath.row == 0 {
                cell.lblTitle.text = "Title 1"
                cell.lblDesc.text = "Desc 1"
            }
            else if indexPath.row == 1 {
                cell.lblTitle.text = "Title 2"
                cell.lblDesc.text = "Desc 2"
            }
            else {
                cell.lblTitle.text = "Title 3"
                cell.lblDesc.text = "Desc 3"
            }
            
            if selectedCellIndex != nil {
                if isDescHidden == false {
                    if cell.isDescHidden == true {
                        cell.lblDesc.isHidden = false
                        cell.btnArrow.setImage(UIImage(systemName: "chevron.up"), for: .normal)
                    }
                    else {
                        cell.lblDesc.isHidden = true
                        cell.btnArrow.setImage(UIImage(systemName: "chevron.down"), for: .normal)
                    }
                }
                else {
                    if cell.isDescHidden == true {
                        cell.lblDesc.isHidden = true
                        cell.btnArrow.setImage(UIImage(systemName: "chevron.down"), for: .normal)
                    }
                    else {
                        cell.lblDesc.isHidden = false
                        cell.btnArrow.setImage(UIImage(systemName: "chevron.up"), for: .normal)
                    }
                }
                cell.isDescHidden = !cell.isDescHidden
            }
            
            cell.btnArrow.tag = indexPath.row
            cell.btnArrow.addTarget(self, action: #selector(downArrowButtonClicked(_:)), for: .touchUpInside)
            
            return cell
    }

從上面的代碼可以看出，這種方法太混亂了。該isDescHidden變數在主視圖控制器和表格視圖單元格類中都定義了，我試圖同時使用它們來展開或折疊特定的單元格。然而，它第一次作業，但如果我有 3 個單元格展開，折疊按鈕點擊不適用于 1-2 次點擊然后作業。

有沒有更好的方法來解決這類問題？或者有什么方法可以直接cell.isDescHidden從@objc func downArrowButtonClicked(_ sender: UIButton)函式中設定值？所以我可以在cellForRowAt函式中使用它嗎？如果我可以直接從中更改單元格變數，我會很高興。

uj5u.com熱心網友回復：

使用以下函式來自動調整行的高度，并為您提供top和bottom約束stackView

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return UITableView.automaticDimension
    }

這是我的 CustomCell

class CustomCell: UITableViewCell {
    @IBOutlet weak var titleCell: UILabel!
    @IBOutlet weak var detail: UILabel!
    @IBOutlet weak var arrowButton: UIButton!

    let upArrow = UIImage(systemName: "chevron.up.circle.fill")
    let downArrow = UIImage(systemName: "chevron.down.circle.fill")
    var onArrowClick: ((UIButton)->())!
    
    @IBAction func handleArrowButton(sender: UIButton){
        onArrowClick(sender)
    }

    func updateArrowImage(expandStatus: Bool){
        arrowButton.setImage(expandStatus ? downArrow : upArrow, for: .normal)
    }
}

對于樣本資料

   let data = [
        ["Nothing", "description is very long description is very long description is very long description is very  "],
        ["Nothing", "description is very long "],
        ["Nothing", "description is very long "],
        ["Nothing", "description is very long "],
        ["Nothing", "description is very long "]
    ]

var eachCellStatus: [Bool] = []

@IBOutlet weak var tableView: UITableView!

override func viewDidLoad() {
     super.viewDidLoad()
     tableView.dataSource = self
     tableView.delegate = self
     for _ in data {
         eachCellStatus.append(true)
     }
}

TableView 方法是這樣的

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return data.count
    }
    
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell") as! CustomCell
        cell.titleCell.text = data[indexPath.row][0]
        cell.detail.text = data[indexPath.row][1]
        cell.detail.isHidden = eachCellStatus[indexPath.row]
        cell.updateArrowImage(expandStatus: self.eachCellStatus[indexPath.row])
        cell.onArrowClick = { button in
            self.eachCellStatus[indexPath.row].toggle()
            cell.updateArrowImage(expandStatus: self.eachCellStatus[indexPath.row])
            tableView.reloadRows(at: [indexPath], with: .automatic)
        }
        return cell
    }

uj5u.com熱心網友回復：

首先創建一個模型以將資料顯示到單元格中。您必須保留單元格的狀態。

struct CellData {
    var title: String
    var details: String
    var isExpanded: Bool
}

在CustomTableViewCell為 cellData 添加一個屬性并從中分配Outlets 資料。還創建一個從protocol重新加載rowUIViewController

protocol CustomTableViewCellDelegate {
    func reloadRow(sender: CustomTableViewCell, flag: Bool)
}

class CustomTableViewCell: UITableViewCell {
    
    @IBOutlet weak var titleLabel: UILabel!
    @IBOutlet weak var detailsLabel: UILabel!
    @IBOutlet weak var showButton: UIButton!
    
    var indexPath: IndexPath?
    var delegate: CustomTableViewCellDelegate?
    
    var data: CellData? {
        didSet {
            
            if let data = data {
                if data.isExpanded == false {
                    detailsLabel.isHidden = true
                    showButton.setImage(UIImage(systemName: "chevron.down"), for: .normal)
                    
                }else {
                    detailsLabel.isHidden = true
                    showButton.setImage(UIImage(systemName: "chevron.up"), for: .normal)
                }
                
                titleLabel.text = data.title
                detailsLabel.text = data.details
            }
        }
    }
    
    override func awakeFromNib() {
        super.awakeFromNib()
        titleLabel.text = nil
        detailsLabel.text = nil
    }
    
    @IBAction func showButtonAction(_ sender: UIButton) {
        if var data = data {
            data.isExpanded.toggle()
            delegate?.reloadRow(cell: self, flag: data.isExpanded)
        }
    }
}

在UIViewController添加一個型別的陣列CellData。viewDidLoad()您可以在方法中分配它的資料。

var tableData: [CellData]

修改numberOfRowsInSection()和cellForRow()方法如吹。

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

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CustomTableViewCell", for: indexPath) as! CustomTableViewCell
    cell.data = tableData[indexPath.row]
    cell.delegate = self
    return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    return UITableView.automaticDimension
}

然后確認CustomTableViewCellDelegate協議UIViewController

extension ViewController: CustomTableViewCellDelegate {
    func reloadRow(sender: CustomTableViewCell, isExpanded: Bool) {
        guard let tappedIndexPath = tableView.indexPath(for: sender) else { return }
        tableData[tappedIndexPath.row].isExpanded = isExpanded
        tableView.reloadRows(at: [indexPath], with: UITableView.RowAnimation.automatic)
    }
}

標籤：迅速 代码 合适的视图 uikit

上一篇：在xcode13中的構建之間保持可訪問性權限

下一篇：如何有效地使用多個鍵對陣列進行Python排序？