33

我有一个以编程方式创建的 UICollectionView。我希望集合视图的行为方式如下：

1. User touches cell
2. Cell background color changes
3. User releases touch
4. Cell background color changes

这应该是在执行与点击操作相关的选择器之前发生的快速颜色更改，其中包含集合视图的视图控制器从堆栈中弹出。

我一直在看这个问题：UICollectionView cell change background while tap

其中有以下用于此目的的方法摘要：

// Methods for notification of selection/deselection and highlight/unhighlight events.
// The sequence of calls leading to selection from a user touch is:
//
// (when the touch begins)
// 1. -collectionView:shouldHighlightItemAtIndexPath:
// 2. -collectionView:didHighlightItemAtIndexPath:
//
// (when the touch lifts)
// 3. -collectionView:shouldSelectItemAtIndexPath: or -    collectionView:shouldDeselectItemAtIndexPath:
// 4. -collectionView:didSelectItemAtIndexPath: or -collectionView:didDeselectItemAtIndexPath:
// 5. -collectionView:didUnhighlightItemAtIndexPath:

我假设我只需要从“触摸开始时”和“触摸结束时”实现上述方法之一。但无论我做什么，似乎背景颜色都会发生变化，然后保持变化。这是我尝试但不起作用的示例：

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
 {
   //pop vc 
 }

- (void)collectionView:(UICollectionView *)collectionView didHighlightItemAtIndexPath:(NSIndexPath *)indexPath
{
  UICollectionViewCell* cell = [collectionView cellForItemAtIndexPath:indexPath];
  cell.contentView.backgroundColor = [UIColor redColor];
}

- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath
{
  UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
  cell.contentView.backgroundColor = [UIColor greenColor];
}

这导致单元格背景颜色仅更改为红色。我还查看了这个问题：UICollectionView Select and Deselect issue并尝试实现 [UICollectionView selectItemAtIndexPath:animated:scrollPosition:] 并在 didSelectItemAtIndexPath 内部调用它，但这也不起作用。集合视图数据源和委托已设置。

4

6 回答 6

50

问题是您正在更改突出显示的颜色并在取消选择时将其更改回而不是取消突出显示

你应该简单地改变这个：

- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath
{
  UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
  cell.contentView.backgroundColor = [UIColor greenColor];
}

对此：

- (void)collectionView:(UICollectionView *)collectionView didUnhighlightItemAtIndexPath:(NSIndexPath *)indexPath
{
  UICollectionViewCell *cell = [collectionView cellForItemAtIndexPath:indexPath];
  cell.contentView.backgroundColor = [UIColor greenColor];
}

此外，如果您不想在高亮显示之前稍等片刻，您应该将delaysContentTouches集合视图的属性设置为NO

编辑：还要确保你打电话

[collectionView deselectItemAtIndexPath:indexPath animated:NO];

-didSelectItemAtIndexPath 方法内部

于 2014-04-30T15:58:12.963 回答
34

斯威夫特 3 版本

将以下两个方法添加到您的视图控制器类：

// change background color when user touches cell
func collectionView(_ collectionView: UICollectionView, didHighlightItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    cell?.backgroundColor = UIColor.red
}

// change background color back when user releases touch
func collectionView(_ collectionView: UICollectionView, didUnhighlightItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    cell?.backgroundColor = UIColor.green
}

有关在 Swift 中设置基本集合视图的帮助，请参见此处。

于 2015-12-29T01:16:13.430 回答
6

编辑：在 Swift 3 中回答

var selectedIndex = Int ()

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! CollectionViewCell

    cell.backgroundColor = selectedIndex == indexPath.row ? UIColor.green : UIColor.red

    return cell
}

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)
{
    selectedIndex = indexPath.row

    self.yourCollctionView.reloadData()
}
于 2017-05-22T12:04:24.393 回答
4

这是我的解决方案。而且我确信它确实有效。
我提供了三种方法来突出显示一个单元格（selectedBackgroundView、tintcell.contentView和 tint a special area）。

使用方法：
1. 只继承BaseCollectionViewCell，什么都不做；
2. 继承并设置specialHighlightedArea = UIView(), and contentView.addSubView(specialHighlightedArea)，然后布局或添加约束以使用 Auto Layout；
3.如果不需要高亮效果，只需编写一个名为'shouldHighlightItemAtIndexPath'的方法，UICollectionViewDelegate并使其返回false，或者设置cell.shouldTintBackgroundWhenSelected = false并设置specialHighlightedArea = nil并从superView中删除。

/// same with UITableViewCell's selected backgroundColor
private let highlightedColor = UIColor(rgb: 0xD8D8D8) 

/// you can make all your collectionViewCell inherit BaseCollectionViewCell
class BaseCollectionViewCell: UICollectionViewCell {

    /// change it as you wish when or after initializing
    var shouldTintBackgroundWhenSelected = true

    /// you can give a special view when selected
    var specialHighlightedArea: UIView? 

    // make lightgray background display immediately(使灰背景立即出现)
    override var isHighlighted: Bool { 
        willSet {
            onSelected(newValue)
        }
    }

    // keep lightGray background until unselected (保留灰背景)
    override var isSelected: Bool { 
        willSet {
            onSelected(newValue)
        }
    }

    func onSelected(_ newValue: Bool) {
        guard selectedBackgroundView == nil else { return }
        if shouldTintBackgroundWhenSelected {
            contentView.backgroundColor = newValue ? highlightedColor : UIColor.clear
        }
        if let area = specialHighlightedArea {
            area.backgroundColor = newValue ? UIColor.black.withAlphaComponent(0.4) : UIColor.clear
        }
    }
}

extension UIColor {
    convenience init(rgb: Int, alpha: CGFloat = 1.0) {
        self.init(red: CGFloat((rgb & 0xFF0000) >> 16) / 255.0, green: CGFloat((rgb & 0xFF00) >> 8) / 255.0, blue: CGFloat(rgb & 0xFF) / 255.0, alpha: alpha)
    }
}
于 2016-10-20T09:23:43.813 回答
2

简单的二进制逻辑解决方案。适用于 Swift 3 和 4：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt
    indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath) as! CategoryCell
    let lastCellColor = cell.backgroundColor
    if cell.isSelected {cell.backgroundColor = .green} else {cell.backgroundColor = lastCellColor}
}
于 2018-12-16T00:54:38.867 回答
1

在里面添加所有子视图contentView，使用backgroundView和selectedBackgroundView来自UICollectionViewCell。不要设置contentView.backgroundColor。

// Add this inside your cell configuration.
private func setupSelectionColor() {
    let backgroundView = UIView()
    backgroundView.backgroundColor = .white
    self.backgroundView = backgroundView

    let selectedBackgroundView = UIView()
    selectedBackgroundView.backgroundColor = .orange
    self.selectedBackgroundView = selectedBackgroundView
}

// Add the deselection inside didSelectCallback
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    collectionView.deselectItem(at: indexPath, animated: true)
}
于 2020-05-20T16:36:09.887 回答