ios - 显示在 UICollectionView 中选择的项目数

Question

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

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

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

添加一个单例 类来保存一组选定的图像 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 中实现以下委托(delegate)函数:

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，则表示未选择单元格，因此标签文本将被删除。