一个UITableView中的多个UICollectionView相互交织滚动

Multiple UICollectionView in a UITableView are intertwined in scrolling

我对 iOS 开发完全陌生,所以我的问题可能是一个菜鸟问题,但我不知道如何让我的 UICollectionViews 彼此分开滚动。当我滚动顶部 UICollectionView 时,向下滚动时,我的另一个 UICollectionView 也滚动而没有触及它。

UICollectionView配置为水平滚动。我想要实现的是 Netflix 所做的事情。用户可以水平滚动,而项目列表是水平显示的。到目前为止,一切正常,除了一个列表的滚动使另一个列表在重绘时也会滚动(我猜,因为我只能看到它发生在设备上尚未显示的列表上。)

我希望我已经正确描述了我的问题,如果您遗漏了一些信息来帮助我解决这个问题,我当然很乐意提供。

所以我的 UITableController 看起来像这样:

class MoviesViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

@IBOutlet weak var containerView: UIView!
@IBOutlet weak var tableView: UITableView!

let categories = ["In theaters", "Popular", "Upcoming", "Top rated"]

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    containerView.backgroundColor = UIColor.init(hex: "232637")
    tableView.backgroundColor = UIColor.init(hex: "232637")
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

func numberOfSections(in tableView: UITableView) -> Int {
    return categories.count
}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 1
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    tableView.rowHeight = 332;
    let cell = tableView.dequeueReusableCell(withIdentifier: "tableCell", for: indexPath) as! TableViewCell
    return cell
}

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 42;
}

func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return categories[section]
}

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int){
    view.tintColor = UIColor.init(hex: "232637")
    let header = view as! UITableViewHeaderFooterView
    header.textLabel?.textColor = UIColor.init(hex: "ff5959")
}

}

我的 UITableViewCell 看起来像这样:

class TableViewCell: UITableViewCell, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {

@IBOutlet weak var collectionView: UICollectionView!

let imageNames = //Some filler data
let gameNames  = //Some filler data

override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code
    collectionView.backgroundColor = UIColor.init(hex: "232637")
    collectionView.contentInset = UIEdgeInsets(top: 0,left: 0,bottom: 32,right: 0)
}

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return imageNames.count
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "collectionCell", for: indexPath) as! MovieCell
    //cell.imageView.imageFromURL(urlString: imageNames[indexPath.row])

    let image = UIImageView(image: UIImage(named: "img-logo"))
    image.contentMode = .scaleAspectFit
    image.frame = cell.containerView.bounds
    image.layer.cornerRadius = 10;
    image.clipsToBounds = true;
    image.imageFromURL(urlString: imageNames[indexPath.row])
    cell.containerView.addSubview(image)
    cell.containerView.backgroundColor = UIColor.init(hex: "232637")

    return cell
}

}

我的 UICollectionViewCell 看起来像这样:

class MovieCell: UICollectionViewCell {

@IBOutlet weak var containerView: UIView!

}

我的观点是这样的:

听起来您没有考虑到单元格(table 视图单元格以及集合视图单元格)被重用 的事实。因此,如果 table 视图包含一个集合视图,并且您滚动该集合视图,然后滚动 table 视图,则 table 视图单元格将在新行中重复使用,而之前滚动的其中的集合视图仍然滚动到您之前放置它的位置。如果这不是您想要的,您可以在发现单元格被重用时重置集合视图的滚动位置。

让我知道您可能不了解单元重用的线索是这一行:

 cell.containerView.addSubview(image)

这是错误的,因为即使单元格被重复使用,您仍然在这样做,这意味着您的某些单元格最终会出现数十个图像视图相互重叠,从而减慢速度并最终可能导致您 运行 内存不足。这不是你问的问题,但它表明你没有意识到单元格重用的含义。