如何处理uitaiteViewCell中按钮的按钮操作？

Question

我正在从事一个购物应用程序项目，客户可以在其中浏览产品并将其添加到购物车中，但是很难弄清楚如何处理TableViewCell中的按钮按钮。我希望它能工作的方式是，按下空圆按钮时，图像将带有选中标记的圆圈更改为填充的圆圈，并且该单元格中的产品被添加到客户的“购物车”中。 “购物车”由两个阵列产品和数量 组成。

这是表观视图的样子：

这是我到目前为止的代码：

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

    let cell = tableView.dequeueReusableCell(withIdentifier: "ProductToBuyCell") as! ProductToBuyCell
    
    //Configure the Selection Button
    cell.selectButton.tag = indexPath.row
    cell.selectButton.addTarget(self, action: #selector(ItemSelected), for: .touchUpInside)
    let product = productsArray[indexPath.row]
    //configure cell
    cell.productImg.image = product.productPhoto
    cell.productImg.contentMode = .scaleAspectFit
    cell.productName.text = product.Name
    cell.price.text = "$\(product.price)"
    
    return cell
}
// func for when the selectButton is tapped
// tag is equal to indexPath.row
@objc func ItemSelected(sender: UIButton) {
    sender.imageView?.image = UIImage(systemName: "checkmark.circle.fill")
    let product = productsArray[sender.tag]
    newOrder.products.append(product)
    newOrder.quantities.append(1)
}

因此，如果有人可以解释如何正确处理由UITATION VIEWCELL中元素引起的事件，以及如何使按钮图像更改，这将不胜感激。

Answer 1

uibutton's imageView是只读的 - 要更新其映像，您应该使用setimage。请注意，您需要跟踪行的选择状态，否则选择状态将在单元重新加载时重置（例如，滚动并回到视图中）。也大概您还需要处理取消按钮的情况。

另外，由于您仅在单元​​格中的uibutton上处理选择，因此点击单元格不会对按钮的状态产生任何影响。取而代之的是，您可以实现tableView（_：didSelectrowat：）并在此处处理选择，并且只有一个简单的uiimageView而不是uibutton uibutton 细胞。您也可以考虑使用 。

uitaiteView还具有，因此，如果您将其打开，可以为您跟踪所选的单元格，而您只需要相应地更新单元格的外观即可。

至于使用tag来找出单元格索引，这是真的，这不是很健壮，但不是问题。绝对值得在上面的评论中查看链接的问题，以了解有关此问题的一些良好讨论。

是的，如果您要坚持使用这种方法，则至少应该在添加新的动作之前删除任何现有动作以避免重复事件，例如button.removetarget（nil，action：nil：nil，for：.Allelevents）。

Answer 2

我假设您的产品模型就是这样。

struct Product {
    let name: String
    let photo: UIImage!
    let price: Double
}

跟踪所选产品。您需要保留细胞的状态。创建另一个类似的模型

struct ProductSelection {
    let product: Product!
    var isSelected: Bool = false
}

为 @ paulw11提到的是“ tag不是一个很好的解决方案，因为默认值为0，如果重新排序行，它将断开”，您可以使用委托模式来获取所选产品指数。

创建productTobuycell的协议。

protocol ProductToBuyCellDelegate: AnyObject {
    func selectedCell(sender: ProductToBuyCell)
}

将委托属性添加到单元格中。

weak var delegate: ProductToBuyCellDelegate?

还要添加iboutlet和ibaction producttobuycell中的按钮。

@IBOutlet weak var checkButton: UIButton!


@IBAction func buttonPressed(_ sender: UIButton) {
    delegate?.selectedCell(sender: self)
}

然后在单元格中添加SelectionProduct属性，并设置uilabel的文本和uiimage的图像使用属性观察者didset

var productSelection: ProductSelection? {
    didSet {
        guard let productSelection = productSelection else { return }

        self.productNameLabel.text = productSelection.product.name
        self.priceLabel.text = "$\(productSelection.product.price)"
        self.productImg.image = productSelection.product.photo
        
        if productSelection.isSelected {
            checkButton.setImage(UIImage(systemName: "checkmark.circle.fill"), for: .normal)
        } else {
            checkButton.setImage(UIImage(systemName: "circle"), for: .normal)
        }
    }
}

修改uiimage的外观在awakefromnib（）方法中

override func awakeFromNib() {
    super.awakeFromNib()
    
    self.productImg.contentMode = .scaleAspectFit
}

，然后修改cellforrowat如下所示。在这里，productSelectionArray是productsection不是产品的数组。

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

现在，确认委托 producttobuycell to view> view controller。在这里，首先，我更改所选单元格的状态，然后使用filter和map 函数在productsselectionarray中检索所有选定的产品。然后重新加载行更新UI。

extension ViewController: ProductToBuyCellDelegate {
    func selectedCell(sender: ProductToBuyCell) {
        guard let tappedIndexPath = tableView.indexPath(for: sender) else { return }

        productSelectionArray[tappedIndexPath.row].isSelected.toggle()

        let selectedProducts = productSelectionArray.filter{ $0.isSelected }.map { (productSelection: ProductSelection) -> Product in
            return productSelection.product
        }

        tableView.reloadRows(at: [tappedIndexPath], with: .none)
    }
}

根据您的UI，似乎所有选定的产品数量都是一个，因此您不必将另一个数组维护数量。