Using SwiftUI .hoverEffect modifier on iPad causes doubling of visuals

November 19, 2020
by Marc
Development / iOS / Making of Captionista
Screenshot of the ugly doubling effect you get when using hoverEffect

Another discovery on the trail to the Captionista release!

I thought I’d add .hoverEffect modifiers for the iPad UI to show the nice hover animations that iOS provides for pointing device users. Sadly, in SwiftUI this doubles up the visual of the buttons when focused. You move the pointer around and can see the lifted/translated version over the top of the original.

Screenshot of the ugly doubling effect you get when using hoverEffect

Workaround: None that I know of yet using SwiftUI. If you know of one please let me know.

Related bug: if your button changes its appearance when tapped, clicking the trackpad on it does not update the appearance clearly until the pointer is moved away.

The Author

Marc Palmer (Twitter, Mastodon) is a consultant and software engineer specialising in Apple platforms. He currently works on the iOS team of Concepts sketching app, as well as his own apps like video subtitle app Captionista. He created the Flint open source framework. He can also do a pretty good job of designing app products. Don't ask him to draw anything, because that's really embarrassing. You can find out more here.