自动选择集合视图的中间可见单元格

Question

我正在尝试在任何给定时间选择并突出显示集合视图中可见单元格的中间单元格。有问题的集合视图显示前后六个月的天数。

我尝试过使用滚动视图委托和集合视图委托。但所有的工作都是在didSelectItem() 集合视图委托中选择并突出显示代码。

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {

    print("delegate called")
    collectionView.scrollToItem(at: indexPath, at: .centeredHorizontally, animated: true)
    collectionView.cellForItem(at: indexPath)?.backgroundColor = UIColor.highlightCellGreen()
    if let cell = collectionView.cellForItem(at: indexPath) as? ClientListDateCollectionViewCell{
        monthLabel.text = cell.monthName
        monthLabel.text = monthLabel.text?.capitalized

}                                                                                      

我尝试在使用viewDidScroll() 委托滚动时选择中间单元格。但是，我无法获得我想要的输出。

func scrollViewDidScroll(_ scrollView: UIScrollView) {

       let visibleCellCount = dateCollectionView.indexPathsForVisibleItems.count
       let cellCount = dateCollectionView.visibleCells.count
let visibleCells = dateCollectionView.indexPathsForVisibleItems[visibleCellCount-1/2]
      if visibleCellCount>0{
       let middle = visibleCellCount/2
       let midValue = dateCollectionView.indexPathsForVisibleItems[middle]
           dateCollectionView.selectItem(at: midValue, animated: true, scrollPosition: .centeredHorizontally)
}                                                                          

如何选择中间单元格？

编辑1：集合视图从最左边开始，然后滚动到中间，即今天的日期

Answer 1

您可以使用 UICollectionView 的委托（即：didHighlightItemAtIndexPath）。只需确保通过调用 reload 函数在您想要的时间调用集合视图代表

self.collectionView.reloadData()

在你的集合视图委托中这样做

 func collectionView(collectionView: UICollectionView, didHighlightItemAtIndexPath indexPath: NSIndexPath){

    var cell : UICollectionViewCell = UICollectionViewCell()

    self.collectionView.cellForItemAtIndexPath = indexPath
    //change highlighted color as of your need
    cell.view.backgroundColor = UIColor.init(red: 25, green: 118, blue: 210).cgColor
    }

这将突出显示您选择的项目

Answer 2

禁用多重选择（或完全选择？）以使事情变得更容易。

collectionView.allowsMultipleSelection = false

在scrollViewDidScroll(_:) 上获取屏幕中心点为CGpoint。

let center = collectionView.center

使用该信息获取中心项的索引路径

let indexPath = collectionView.indexPathForItem(at: center)

选择项目

collectionView.selectItem(at: indexPath, animated: true, scrollPosition: .top)

Answer 3

假设您有水平显示，并且您希望自动滚动到数据源中项目的中心。

1. 创建一个方法并在你的集合视图完全配置后立即调用它：

   func scrollToCenterIndex() {
       let centerIndex = LIST_OF_YOUR_DATA_SOURCE.count / 2
       let indexPath = IndexPath(item: centerIndex, section: 0)
       self.collectionView.scrollToItem(at: indexPath,
                                        at: .right,
                                        animated: false)
    }
   

2. 方法内部：

   public func collectionView(_ collectionView: UICollectionView,
                                cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
       guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: CELL,
                                                           for: indexPath) as? CustomCell else {
                                                             fatalError("Cannot create cell")
       }
   
       If indexPath.row == LIST_OF_YOUR_DATA_SOURCE.count / 2  {
           // perform your hight light color to the cell
       } else {
           // reset your hight light color to default color
       }
       let model = LIST_OF_YOUR_DATA_SOURCE[indexPath.row] 
       cell.configure(model)
   
       return cell
     }
   

Answer 4

我认为您可以使用一种方法来获取集合视图的中心点，并使用该值来获取可见单元格的中间。

let centerPoint = self.view.convert(collectionView.center, to: collection)

这是一个我用 tableView 做的例子。您可以使用相同的方法将其应用于您的集合视图。

class ViewController: UIViewController {
  @IBOutlet weak var tableView: UITableView!
  var dataSource = Array(1...31)
  var centerIndex: IndexPath?

  func setCellSelected(cell: UITableViewCell, _ selected: Bool) {
    cell.contentView.backgroundColor = selected ? .green : .white
  }
}

extension ViewController: UITableViewDataSource {
  func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    dataSource.count
  }

  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "CELL")
    cell?.textLabel?.text = String(dataSource[indexPath.row])

    let center = self.view.convert(tableView.center, to: tableView)
    if let index = tableView.indexPathForRow(at: center), let cell = cell {
      setCellSelected(cell: cell, indexPath.row == index.row)
    }
    return cell!
  }
}

extension ViewController: UITableViewDelegate {
  func scrollViewDidScroll(_ scrollView: UIScrollView) {
    // reset the previous hight light cell
    if let centerIndex = centerIndex, let cell = tableView.cellForRow(at: centerIndex) {
      setCellSelected(cell: cell, false)
    }
    // set hight light to a new center cell
    let center = self.view.convert(tableView.center, to: tableView)
    if let index = tableView.indexPathForRow(at: center), let cell = tableView.cellForRow(at: index) {
      setCellSelected(cell: cell, true)
      centerIndex = index
    }
  }
}

Answer 5

我也在尝试自动选择集合视图的中间可见单元格，我得到了解决方案，这里是解决方案：

func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
// Reload Collection View
collectionView.reloadData()
// Find centre point of collection view
let visiblePoint = CGPoint(x: collectionView.center.x + collectionView.contentOffset.x, y: collectionView.center.y + collectionView.contentOffset.y)
// Find index path using centre point
guard let newIndexPath = collectionView.indexPathForItem(at: visiblePoint) else { return }
// Select the new centre item
collectionView.selectItem(at: newIndexPath, animated: true, scrollPosition: .centeredHorizontally)   }

您需要使用滚动视图委托函数，scrollViewDidEndDecelerating。首先重新加载集合视图。其次，找到集合视图的中心可见点。第三，使用中心可见点，找到collection view的indexPath，最后使用index选择collection view中的item。

我知道我回答这个问题有点晚了，仍然认为它会对某人有所帮助。

干杯！