当我滚动 UITableview 时自动滚动 UICollectionView

Auto scroll UICollectionView when I scroll UITableview

我上面有一个水平的 CollectionView,下面有一个 TableView 我想当我滚动 TableView 时,我的 CollectionView 应该滚动并动画到我用 scrollItemTo 达到的某个水平,但是 CollectionView 滚动速度变慢但我希望它像它一样工作正在 uberEats iOS 应用中的餐厅项目列表详细信息中工作,同样正在 urbanClap 应用中工作

这就像在 table 视图部分 header 到达顶部时逐个移动视图单元格

您可以为您的 tableView 实施 scrollViewDidScrollUIScrollViewDelegate,然后从那里手动滚动您的 UICollectionView

class XYZ: UIViewController, UIScrollViewDelegate{

     func viewDidLoad(){
         super.viewDidLoad()
         tableView.delegate = self
     }


    func scrollViewDidScroll(_ scrollView: UIScrollView){
         let tableView = scrollView //assuming the only scrollView.delegate you conform to is the tableVeiw

         collectionView.contentOffset = someMappingFrom(tableView.contentOffset) //or some other scrolling mechanism (scrollToItem)
    }


}

您提到的 uber eats 应用程序功能的工作方式如下:每当 tableView 的特定部分到达顶部时,就会选择该特定的 collectionViewCell

从上面的说法可以看出,

collectionView 中的项目数 = tableView

中的部分数

您可以通过跟踪 tableView 的顶部可见部分索引然后选择该特定索引处的 collectionViewCell 来解决此特定问题,即

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    if scrollView === self.tableView {
        if
            let topSectionIndex = self.tableView.indexPathsForVisibleRows?.map({ [=10=].section }).sorted().first,
            let selectedCollectionIndex = self.collectionView.indexPathsForSelectedItems?.first?.row,
            selectedCollectionIndex != topSectionIndex {
            let indexPath = IndexPath(item: topSectionIndex, section: 0)
            self.collectionView.selectItem(at: indexPath, animated: true, scrollPosition: .centeredHorizontally)
        }
    }
}

更改 collectionViewCell 选择颜色:

创建自定义 UICollectionViewCell 并覆盖 **isSelected** 属性 以处理选定和 un-selected 状态,即

class CollectionViewCell: UICollectionViewCell {
    @IBOutlet weak var titleLabel: UILabel!

    override var isSelected: Bool {
        didSet {
            if self.isSelected {
                self.contentView.backgroundColor = #colorLiteral(red: 0.2588235438, green: 0.7568627596, blue: 0.9686274529, alpha: 1)
            } else {
                self.contentView.backgroundColor = #colorLiteral(red: 0.8039215803, green: 0.8039215803, blue: 0.8039215803, alpha: 1)
            }
        }
    }
}

此后您将不需要在其他地方手动更新单元格的 backgroundColor

您需要更改 scrollViewDidScroll 上的选择。

我已将 link 附加到相同代码的回购

Github Repo for solution