显示在 UICollectionView 中选择的项目数

Question

我正在使用 UICollectionView 来显示图像。从该 collectionView 用户可以选择多个图像。现在我可以通过覆盖 UICollectionViewCell 的选定变量来更改选定图像的视图。

override var selected: Bool {
didSet {
    if self.selected {
        imageView.layer.borderWidth = 5.0
    } else {
        imageView.layer.borderWidth = 0.0
    }
}
}

我在单元格的 UIImageView 顶部放置了一个 UILabel 以显示计数。但我无法更新所选图像的数量。当用户取消选择图像时，应更新计数。我怎样才能做到这一点？它应该类似于 Facebook 图像选择器。我不想重新加载 collectionView。

Answer 1

正如您在 cmets 中阐明的那样，您希望单元格中的数字显示所选图像的顺序。

添加一个 singleton 类来保存一组选定的图像 ID。单例的特点是它的实例可以从你的应用程序的任何地方访问：

class ImageSelectionManager {

    /// The singleton instance
    static let instance = ImageSelectionManager()

    /// This is the array that holds the order of selected image IDs
    var selectedImageIds: [String] = []
}

在您的UICollectionViewController 中实现以下委托函数：

class YourViewController: UICollectionViewController {

    override func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {

        // Get the selected cell
        let cell = collectionView.cellForItemAtIndexPath(indexPath) as! YourCell

        // Get the selected image ID
        let imageId = cell.imageId

        // Add ID
        ImageSelectionManager.instance.selectedImageIds.append(imageId)

        // Notify cells that image array has changed
        NSNotificationCenter.defaultCenter().postNotificationName(
            "ImageSelectionChangedNotification",
            object: self)
    }

    override func collectionView(collectionView: UICollectionView, didDeselectItemAtIndexPath indexPath: NSIndexPath) {

        // Get the deselected cell
        let cell = collectionView.cellForItemAtIndexPath(indexPath) as! YourCell

        // Get the deselected image ID
        let imageId = cell.imageId

        // Remove ID
        ImageSelectionManager.instance.selectedImageIds = ImageSelectionManager.instance.selectedImageIds.filter({ $0 != imageId })

        // Notify cells that image array has changed
        NSNotificationCenter.defaultCenter().postNotificationName(
            "ImageSelectionChangedNotification",
            object: self)
    }
}

在您的UICollectionViewCell 中添加一个观察者通知和一个更新计数器标签的功能：

class YourCell: UICollectionViewCell {

    /// The ID of your image that the cell is showing
    var imageId: String!

    /// The counter label
    var counterLabel: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()

        // Start listening to notifications
        registerForNotifications()
    }
    override func prepareForReuse() {
        super.prepareForReuse()

        counterLabel.text = nil
    }

    deinit {
        unregisterFromNotifications()
    }

    func registerForNotifications() {

        // Make the cell listen to changes in the selected images array
        NSNotificationCenter.defaultCenter().addObserver(
            self,
            selector: #selector(self.handleNotification(_:)),
            name: "ImageSelectionChangedNotification",
            object: nil)
    }

    func unregisterFromNotifications() {

        // Stop listening to notifications
        NSNotificationCenter.defaultCenter().removeObserver(self)
    }

    func handleNotification(notification: NSNotification) {

        // If the notification is the one we are listening for
        if notification.name == "ImageSelectionChangedNotification" {

            // Execute on main thread because you are changing a UI element
            dispatch_async(dispatch_get_main_queue()) {

                // Get the position in the selected images array
                if let position = ImageSelectionManager.instance.selectedImageIds.indexOf({ $0 == self.imageId }) {

                    // Image position was found so set the label text
                    self.counterLabel.text = String(position)

                } else {
                    // Image was not found no remove the label text
                    self.counterLabel.text = nil
                }
            }
        }
    }
}

它的工作原理是这样的：

1. 一个单元格被选中/取消选中。
2. 从单例数组中添加/删除单元格的图像 ID。
3. 向单元格发送通知。
4. 每个单元格都会收到通知并检查其图像 ID 在单例数组中的位置。
5. 如果图像 ID 在数组中有位置，则标签文本会随位置更新。如果未找到图像 ID，则表示未选择单元格，因此将删除标签文本。

Answer 2

首先，您需要一个模型类来存储选择状态和其他属性。
例如，您正在为您的 collectionView 中的图像填充数据。

class MyImage : NSObject {
   var name : String?
   var selectionNumber : Int? // Using for selection update on UI 
  /*other properties below*/

}

现在在您的 Collection View Cell 中使用 hooked didSet 创建一个 MyImage 属性

var image : MyImage? {
didSet {
   imageView.image = UIImage(named:image.name)
   if image.selectionNumber != nil {
      imageView.layer.borderWidth = 5.0
      lblCount.text = String(selectionNumber + 1)
   }
   else {
      imageView.layer.borderWidth = 0.0
      lblCount.text = ""
   }
}

现在在您的视图控制器类或您正在实现 collectionView 的委托方法的类中。

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell
{
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier(kYour_Cell_ID, forIndexPath: indexPath) as! YourCustomCell
    let myImage = self.dataSource[indexPath.row]
    myImage.selectionNumber = self.selectedIndexes.contains(indexPath)
    cell.image = myImage
    return cell
}

您的 dataSource 将是包含 MyImage 对象的数组，并创建一个用于存储所选 indexPaths 的数组。

   func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath)
    {
        let idx = self.selectedIndexes.indexOf(image)
        if (idx != nil) {
            self.selectedIndexes.remove(indexPath.row)
        }
        else
        {
           self.selectedIndexes.append(indexPath.row)
        }
       self.collectionView.reloadItemsAtIndexPaths([self.selectedIndexes])
    }