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