AppleTV focused image border does not scale

Question

I'm making a tvOS app. I have a collection view cell, which has a UIImageView. I check "Adjust image when focused" in the interface builder so I can use the system provided focus effect for the image. The problem is that I'm also setting a border for the image. The border does not scale up with the image when the view gets focus and the image scales up. Any ideas how can I update the border's dimensions when the view is focused?

Answer 1

I think you should put your imageView in UIView's object and then give the border to this view. after that you should override "didUpdateFocus" method and make animation as you want. see, In my case, I have put imageView in "viewBg" object and give animation to this object.

In your class :

func viewAnimation(view:UIView , isNormal:Bool)
{
    UIView.animate(withDuration: 0.5, animations: { () -> Void in
        if isNormal{
            view.transform = CGAffineTransform(scaleX: 1.0, y: 1.0);
        }
        else{
            view.transform = CGAffineTransform(scaleX: 1.3, y: 1.3);
        }

        })
    { (finished) -> Void in

    }
}

override func didUpdateFocus(in context: UIFocusUpdateContext, with coordinator: UIFocusAnimationCoordinator) {
    if(context.previouslyFocusedView != nil)
    {
        if (context.previouslyFocusedView is testCell)
        {
            let cell:testCell = context.previouslyFocusedView as! testCell
            self.viewAnimation(view: cell.viewBg, isNormal: true)
        }
    }
    if(context.nextFocusedView != nil)
    {
        if (context.nextFocusedView is testCell)
        {
            let cell:testCell = context.nextFocusedView as! testCell
            self.viewAnimation(view: cell.viewBg, isNormal: false)
        }
    }
}

In your CollectionViewCell method:

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell:testCell = collectionView.dequeueReusableCell(withReuseIdentifier: "testCell", for: indexPath) as! testCell
    cell.imgIcon.image  = UIImage(named:arrayIconImages.object(at: indexPath.row) as! String)
    cell.viewBg.layer.borderColor = UIColor.black.cgColor
    cell.viewBg.layer.borderWidth = 10.00
    return cell
}

So, By this way you can give animation with border at image view.