根据 CollectionView 中的选择更改 ImageView

Posted

技术标签:

【中文标题】根据 CollectionView 中的选择更改 ImageView【英文标题】:Changing ImageView Based on Selection In A CollectionView 【发布时间】:2017-08-16 21:27:05 【问题描述】:

我目前有一个 CollectionView 和 1 个可重复使用的单元格,其中填满了 ImageView。这个单元格被使用了 10 次来展示 10 种不同的动物(我提供了单元格的图片)。我在这个集合视图上方也有一个标签。每次用户按下单元格时,标签都会变为“所选动物的名称”。 我现在想要的是让单元格图像在被选中时变暗,在未选中时恢复正常。到目前为止,我知道如何将单元格的图像更改为更暗的图像手动将其切换为较暗的,但我不知道如何将其更改为正常,因为我选择了另一个。 我该如何实现?我在底部复制了我的代码:

//cell configuration
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 

        //define the cell
        let cell = collectionview.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as! AnimalSelectionCell

        //animals is name of array of different types of animals
        cell.animalImage.image = UIImage(named: animals[indexPath.row])
        cell.animalImage.restorationIdentifier = animals[indexPath.row]

        return cell
    

    //choosing an animal
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)         
            let currentCell = collectionview.cellForItem(at: indexPath) as! AnimalSelectionCell
            let animal = currentCell.animalImage.restorationIdentifier! //gets what type of animal selected
            selectionLabel.text = "\(animal) selected" //changes label
            currentCell.animalImage.image = UIImage(named: animal + "Selected") //changes to darker animal image                 
        

【问题讨论】:

【参考方案1】:

您可以定义一个名为 selectedIndexpathvar 并在您的 didSelectItemAt 方法中通过选定的 indexpath 进行更改,如果 selectedIndexPath 相同,您应该将 selectedIndexpath 设置为 nil 并且在您的 cellForItemAt 方法中您只需要检查当前 indexPath 是否等于您的 selectedIndexpath 属性

var selectedIndexPath : IndexPath? //declare this

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 

        //define the cell
        let cell = collectionview.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as! AnimalSelectionCell

        //animals is name of array of different types of animals
        cell.animalImage.image = UIImage(named: animals[indexPath.row])
        if(indexPath == selectedIndexPath)
            //if indexpath is selected use your darker image
            cell.animalImage.image = UIImage(named: animal + "Selected")
        
        cell.animalImage.restorationIdentifier = animals[indexPath.row]
        return cell
    

    //choosing an animal
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)         
            let currentCell = collectionview.cellForItem(at: indexPath) as! AnimalSelectionCell
            let animal = currentCell.animalImage.restorationIdentifier! //gets what type of animal selected
            selectionLabel.text = "\(animal) selected" //changes label
            var prevSelectedIndexPath : IndexPath?
            if(selectedIndexPath != nil)
                 if(selectedIndexPath == indexPath)
                     selectedIndexPath = nil
                 else
                     prevSelectedIndexPath = IndexPath(row: selectedIndexPath.row, section: selectedIndexPath.section)
                     selectedIndexPath = indexPath
                 
            else
                selectedIndexPath = indexPath
            

            if(prevSelectedIndexPath != nil)
                 collectionView.reloadItems(at: [indexPath,prevSelectedIndexPath])
            else
                 collectionView.reloadItems(at: [indexPath])
            
        

func clearSelection()
    if(selectedIndexPath != nil)
         let prevSelectedIndexPath = IndexPath(row: selectedIndexPath.row, section: selectedIndexPath.section)
         selectedIndexPath = nil
         self.collectionView.reloadItems(at: [prevSelectedIndexPath])
    

【讨论】:

这使所选动物的图像变暗,但是每当我选择另一个动物时,我之前选择的动物图像仍然变暗。我该如何解决这个问题? 我还有一个清除按钮,当我按下它时,标签变为“未选择动物”。我应该在 IBAction 代码中使用这段代码的哪一部分,这样当我按下清除按钮时,所有图像都会恢复正常? @fphelp 很高兴为您提供帮助【参考方案2】:

为此,您必须继承 UICollectionViewCell 并覆盖 isSelected 属性:

class MyCell: UICollectionViewCell 
    override var isSelected 
        willSet(bool) 
            self.backgroundColor = UIColor.gray // or whatever
        
    

【讨论】:

以上是关于根据 CollectionView 中的选择更改 ImageView的主要内容,如果未能解决你的问题,请参考以下文章

CollectionView -> 根据是不是登录更改流程

如何根据设备主题更改collectionview单元格颜色(按照我的配色方案)

根据 UICollectionView 内容快速移动视图

如何更改集合视图单元格中的图像

如何根据用户选择在 CollectionView 标题下方显示不同的单元格?

滚动时collectionview更改单元格背景图像