tvOS: Unable to scroll through UICollectionView items when it is implemented like this: UICollectionView inside UITableView

Question

I have implemented this:
By following this tutorial.
Here's the problem:

I am unable to scroll through the collection items.

I think this has something to do with the fact that the project I followed is for iOS and my project is for tvOS.
I've found a somewhat similar question. An answer linked to this GitHub Repo whose implementation doesn't seem that different from mine.

Here's the relevant code:

ViewController.swift

class ViewController: UIViewController {
    @IBOutlet weak var tableView: UITableView!
    override func viewDidLoad() {
        super.viewDidLoad()
    }
}

extension ViewController: UITableViewDelegate, UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell =
            tableView.dequeueReusableCell(withIdentifier: "tableViewCell", for: indexPath) as? TableViewCell
            else {
                fatalError("Unable to create explore table view cell")}
        return cell
    }
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 140
    }
}

tableViewCell.swift

class TableViewCell: UITableViewCell {

    @IBOutlet weak var collectionView: UICollectionView!
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
        collectionView.delegate = self
        collectionView.dataSource = self
    }

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

}

extension TableViewCell:  UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 50
    }
    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "collectionViewCell", for: indexPath)
        return cell
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        // For some reason he chose the measures of collectionViewCell and substracted 2
        return CGSize(width: 139, height: 64)
    }
    
    // Highlight the current cell
    // This doesn't work
       func collectionView(_ collectionView: UICollectionView, didUpdateFocusIn context: UICollectionViewFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
           if let pindex  = context.previouslyFocusedIndexPath, let cell = collectionView.cellForItem(at: pindex) {
               cell.contentView.layer.borderWidth = 0.0
               cell.contentView.layer.shadowRadius = 0.0
               cell.contentView.layer.shadowOpacity = 0.0
           }
    
           if let index  = context.nextFocusedIndexPath, let cell = collectionView.cellForItem(at: index) {
               cell.contentView.layer.borderWidth = 8.0
               cell.contentView.layer.borderColor = UIColor.orange.cgColor
               cell.contentView.layer.shadowColor = UIColor.orange.cgColor
               cell.contentView.layer.shadowRadius = 10.0
               cell.contentView.layer.shadowOpacity = 0.9
               cell.contentView.layer.shadowOffset = CGSize(width: 0, height: 0)
               collectionView.scrollToItem(at: index, at: [.centeredHorizontally, .centeredVertically], animated: true)
           }
       }
}

In a separate project, I have implemented a collectionView independently. I.e: It was not embedded inside of a tableView. And it works just fine.

I copied the code from that project that highlights the selected cell and added it to the tableViewCell.swift but it had no impact at all.

So my question is:

Why am I unable to select a cell and/or scroll through the collectionView?

score 4 · Accepted Answer · answered Oct 02 '20 at 15:40

4

Found the answer here:

By denying the focus of the table cell, the Focus engine will automatically find the next focusable view on the screen. And in your case, that is the collection view’s cell.

func tableView(_ tableView: UITableView, canFocusRowAt indexPath: IndexPath) -> Bool {
      return false
    }

answered Oct 02 '20 at 15:40

AG_HIHI

1,705
5
27
69

Hey this really worked. I was breaking my head about this from a long time. Thanks. Could you tell me how you found this solution? – iPhoneDeveloper Oct 06 '20 at 13:34
By doing this, the rows won't get highlighted. What is work around for that? When i scroll different sections of tableview i want it to be highlighted as well. – iPhoneDeveloper Oct 06 '20 at 13:49
I posted the link to the answer. I'm not sure you can BOTH highlight the tableViewCell and keep this behaviour though. They're mutually exclusive. – AG_HIHI Oct 07 '20 at 09:54
@AG_HIHI Thanks for updating your answer after your work done. You saved the time. I was stuck too. – UGandhi May 08 '21 at 20:49
Glad I helped :D – AG_HIHI May 09 '21 at 09:24

tvOS: Unable to scroll through UICollectionView items when it is implemented like this: UICollectionView inside UITableView

1 Answers1