Search code examples
androidoverlaychromecastgoogle-cast

Coach Marks Overlay with Chromecast

So I'm working on an application that uses Google Chromecast and I want to implement a coach marks system when casting first becomes available to the user. To do this I want a semi-transparent overlay over the entire screen except where the cast button is, as seen in the cast UX Guidelines:

enter image description here

(without the green A, B, C tags, those were just for pointing stuff out on the Google page)

However I can't find any good way to do this, or any way at all. I managed to make a semi-transparent overlay just fine using two different methods: one where I simply added a layout to the screen with a custom drawable and another where I created a second activity with a semi-transparent theme. I do not know, however how I can find the location of the cast button on the screen (for different screen sizes) or how I can make part of the overlay entirely transparent.

Looking through Google's sample code I am unable to find an actual instance of this demo screen being implemented.

How do I:

  1. Find out when and where the Cast button has been added to the ActionBar
  2. Build this semi-transparent overlay so that the button is visible?

Thanks!

Solution

  • Take a look at the Showcase View library. It creates the type of overlay you described and looks like it handles locating the items you'd like to showcase automatically.

    As for when the cast button appears, it should be shown when onCastDeviceDetected is called. You can hook into that to show the overlay.