如何在UICollectionView分区的最后一个单元格中添加拍照操作按钮？

嘿，我来帮你搞定这个需求！要在每个UICollectionView分区的最后一个单元格加拍照按钮，点击后把照片添加到对应分区，其实可以按以下步骤一步步实现：

1. 调整数据源结构，区分普通图片项和拍照按钮项 #

首先我们需要明确每个分区里的两种元素：实际的图片，以及末尾的拍照按钮。可以用一个枚举来统一管理：

enum CollectionItem {
    case photo(UIImage)
    case cameraButton
}

// 假设你的数据源是一个二维数组，每个子数组对应一个分区的内容
var sectionData: [[CollectionItem]] = []

这样每个分区的数据源里，最后一个元素固定是.cameraButton，前面的都是.photo类型的图片项。

2. 创建两种UICollectionViewCell类型 #

为了区分显示逻辑，建议创建两个独立的Cell：

• PhotoCollectionViewCell：用于显示图片
• CameraCollectionViewCell：包含拍照按钮的单元格

PhotoCollectionViewCell示例 #

class PhotoCollectionViewCell: UICollectionViewCell {
    let imageView = UIImageView()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupUI()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        setupUI()
    }
    
    private func setupUI() {
        imageView.frame = bounds
        imageView.contentMode = .scaleAspectFill
        imageView.clipsToBounds = true
        addSubview(imageView)
    }
    
    func configure(with image: UIImage) {
        imageView.image = image
    }
}

CameraCollectionViewCell示例（带点击回调） #

class CameraCollectionViewCell: UICollectionViewCell {
    let cameraButton = UIButton(type: .system)
    var onTap: (() -> Void)?
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupUI()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        setupUI()
    }
    
    private func setupUI() {
        cameraButton.setTitle("拍照", for: .normal)
        cameraButton.titleLabel?.font = UIFont.systemFont(ofSize: 14)
        cameraButton.addTarget(self, action: #selector(cameraButtonTapped), for: .touchUpInside)
        
        cameraButton.frame = bounds
        addSubview(cameraButton)
    }
    
    @objc private func cameraButtonTapped() {
        onTap?()
    }
}

3. 实现UICollectionView数据源方法 #

在你的ViewController里，实现核心的数据源逻辑：

// 注册Cell
collectionView.register(PhotoCollectionViewCell.self, forCellWithReuseIdentifier: "PhotoCell")
collectionView.register(CameraCollectionViewCell.self, forCellWithReuseIdentifier: "CameraCell")

// 返回每个分区的项目数：实际图片数 + 1（拍照按钮）
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return sectionData[section].count
}

// 根据位置返回对应的Cell
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let item = sectionData[indexPath.section][indexPath.item]
    
    switch item {
    case .photo(let image):
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "PhotoCell", for: indexPath) as! PhotoCollectionViewCell
        cell.configure(with: image)
        return cell
    case .cameraButton:
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CameraCell", for: indexPath) as! CameraCollectionViewCell
        // 绑定点击回调，传递当前分区信息
        cell.onTap = { [weak self] in
            self?.presentCamera(for: indexPath.section)
        }
        return cell
    }
}

4. 处理拍照逻辑并更新数据源 #

实现presentCamera(for section: Int)方法，调出相机/相册，获取照片后插入到对应分区的倒数第二个位置（因为最后一个是按钮）：

private func presentCamera(for section: Int) {
    // 这里可以用UIImagePickerController来实现拍照/选图逻辑
    let picker = UIImagePickerController()
    picker.sourceType = .camera // 如果要支持相册，可以改成.photoLibrary
    picker.delegate = self
    present(picker, animated: true)
}

// 实现UIImagePickerControllerDelegate
extension YourViewController: UIImagePickerControllerDelegate, UINavigationControllerDelegate {
    func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
        picker.dismiss(animated: true)
        
        guard let image = info[.originalImage] as? UIImage else { return }
        
        // 将新照片插入到对应分区的倒数第二个位置（因为最后一个是相机按钮）
        let insertIndex = sectionData[section].count - 1
        sectionData[section].insert(.photo(image), at: insertIndex)
        
        // 刷新对应位置的Cell，带动画效果
        let indexPath = IndexPath(item: insertIndex, section: section)
        collectionView.insertItems(at: [indexPath])
    }
}

5. 额外注意事项 #

• 确保每个分区的数据源初始化时，最后一个元素都是.cameraButton，比如新增分区时：

  func addNewSection() {
      // 初始分区只有拍照按钮
      sectionData.append([.cameraButton])
      collectionView.reloadData()
  }
  

• 如果你的分区头是自定义的，确保viewForSupplementaryElementOfKind方法正常实现，不会和Cell逻辑冲突。

这样就能完美实现你想要的效果：每个分区的最后一个单元格是拍照按钮，点击后拍摄的照片会直接添加到对应分区中，且只有最后一个单元格显示按钮～

内容的提问来源于stack exchange，提问作者user8990288