tvOS: How do I make a circular button that still gets a shadow when focused?
I spoke with Apple engineers at the tvOS talks in Seattle this month - there is currently no way to get the system-standard Focus behaviors (parallax, motion effects, shine, etc) for round UIButtons - which is a bummer!
They recommended that I either change the design, or write my own focus/parallax/motion effects for the UIButton. I'm not eager to write my own - it's probably not possible to fully replicate the system-standard effects, and when the platform changes in the future, the custom effects will probably look dated.
Update: I've written up a blog post and included sample code for accomplishing this effect: http://www.devsign.co/notes/custom-focus-effects-in-tvos
Update #2: As of WWDC 2017, tvOS supports non-roundrect buttons! Here's Apple's documentation.
You can achieve this effect by utilizing the focus engine and determining when your button is in focus, and applying the proper transformations on it.
I like to achieve a similar effect on my views by applying a scaling transformation on the view, and also apply a shadow effect like this. Remember to implement rasterization on the layer for performance:
if context.nextFocusedView == accountAddOkButton {
context.nextFocusedView!.transform = CGAffineTransformMakeScale(1.1, 1.1)
let layer = context.nextFocusedView!.layer
layer.shadowOffset = CGSizeMake(1, 1)
layer.shadowColor = UIColor.blackColor().CGColor
layer.shadowRadius = 12.0
layer.shadowOpacity = 0.80
layer.shadowPath = UIBezierPath(rect: layer.bounds).CGPath
}
EDIT:
Be sure to take a look at apple's documentation for creating Parallax Artwork if you wan't to achieve the same effect they use throughout the home screen https://developer.apple.com/library/prerelease/tvos/documentation/General/Conceptual/AppleTV_PG/CreatingParallaxArtwork.html