SWIFT: How to fix cell highlighter and make the whole collection view scroll instead of the highlighter?


I am building a TVOS app where I have this collectionView:
enter image description here
The current cell (The cell which has scrolled to), gets highlighted in Orange.
For example, here the user scrolls to the third cell:
enter image description here
When the user scrolls to another cell, I want the Orange square, to remain in the first cell, and the whole collection to scroll to the left(or to the right if the user is scrolling in the opposite direction.
And I honestly have no idea how to achieve this, or what should I use exactly.
Should I embed the whole collection view inside of a scrollView?
Anyway, here’s how implemented that collection view:

extension MoviesViewController2: UICollectionViewDelegate, UICollectionViewDataSource {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
            print("first function collectionView detected")
            return items2.count
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier:
            cellIdentifier, for: indexPath) as! movieCardCell
              cell.movieImageView.sd_setImage(with: URL(string: items2[indexPath.item].imageURL))
            return cell
    // Handle collectionViewItem selection
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    // Highlight the current cell
    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)

If anyone can answer the question above, it’d be great. Also any tip or what I should use is most welcome.

Source: Swift Questions

Categorised as swift, tvos, uicollectionview, uiscrollview Tagged , , ,


The process might be as follows:

  • Set your collectionView’s size to single cell size. And align it to the left
  • Make your collectionView’s clipsToBounds property to false
  • Make UICollectionView paging enabled.
  • Place a rectangle view on top of your collectionView

Tracey Bergstrom

Leave a Reply

Your email address will not be published. Required fields are marked *

Still Have Questions?

Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us