Develop a custom Tile with Quick Settings Tile API

Leonardo Pirro
AndroidPub
Published in
4 min readOct 26, 2017

Quick Settings Tile is a fairly new API, introduced with Android 7.0 Nougat (API 24). It enables developers to add custom Tiles in the Quick Settings menu in addition to the existing ones such as WiFi, Bluetooth, Airplane Mode, etc.

Tiles gives the user quick access to a specific task or functionality of the app without opening the app itself, improving the productivity and overall user-experience of the app.

When developers should consider to add a custom Tile in their apps

There are two main things to consider when deciding to integrate a custom Tile in your app:

  • Urgency of the action: When you want to give blazing-fast access to a functionality or a task
  • Frequency: If the user requires a specific functionality of your app a few times per day/week

For example, let’s assume that we are a Taxi company, and we have developed our unique app to order a cab. We can develop a custom Tile that, with a single tap of a button, can order a cab and take us to home or work. We won’t need to search / open the app in the app drawer and we don’t need to type any address (because you already configured your work and home address on your account). This can save a lot of time and your user will be happy and more productive.

How to develop a Tile

In our example, we will develop a custom Tile that will create a new calendar event. Let’s see how.

Each Tile is associated with a TileService which is in charge of updating the status of the Tile and it manages the user interactions such as clicks.

TileService has 4 main method callbacks:

OnTileAdded: When the user adds the Tile in the Quick Settings

OnTileRemoved: When the user removes the Tile from the Quick Settings

OnTileClick: When the user clicks the Tile

OnStartListening: When the Tile becomes visible (this happens when you have already added the tile and you open the Quick Settings)

OnStopListening: When the Tile is no longer visible (when you close the Quick Settings)

OnTileAdded() called when we add a Tile

So, let’s create our TileService class:

As the TileService is like any other Android Service, we need to declare it in the AndroidManifest:

The tag names speak for themselves: android:icon="@drawable/ic_tile_caledar is used for set the Tile icon and android:label="@string/calendar_tile_name" is used for its label.

Handling the Tile click

We manage the user click on the onClick() method. Since we need to create a new calendar event for our example, we need to create and start the Intent in that method.

You may notice that we used startActivityAndCollapse() instead of the common startActivity(). We used startActivityAndCollapse() because with this method the system closes the Quick Settings automatically when called. Otherwise, the Quick Settings menu remains in front of the UI and we can’t see the activity launched after the click.

New calendar event demo

And we are done! We created our first Tile with a working use-case. Now, let’s see some extra-features of the Tile.

You can check-out the full example on my GitHub repo at this link:

Update the Tile from code

You can of course change/update the Tile programmatically, and it’s pretty easy: In your TileService class, you can retrive the Tile instance by calling getQsTile() and then you’ll able to use it’s methods to change its strutcure. Remember to call updateTile() in order to apply new changes.

Another cool method is setState(), you can set 3 state for the Tile:

Depending on the state of the Tile, the icon will automatically be tinted.

For example, if the Tile requires an internet connection and you are offline, you can set the state to STATE_UNAVAILABLE so the user can’t click the Tile, preserving the user experience.

Thanks for reading. That’s all about Quick Settings Tile API! If you want to learn a little bit more, check the official documentation for the Tile and TileService.

My experience with QuickHue

Quick Settings API is very powerful if used for a purpose. In fact, in 2016 I released an app called QuickHue that takes advantage of this API. With this app you can switch on/off your home lights directly from the Quick Settings, with one tap. Today QuickHue has 30,000 active users and the app is available on Play Store at the following link:

https://play.google.com/store/apps/details?id=com.lpirro.quickhue

Did you liked the article? Stay in touch and follow me on Twitter (@lpirro93) or write me an email (leonardo.pirro@gmail.com)

--

--

Leonardo Pirro
AndroidPub

Android Developer 🚀 , UX/UI lover, design addicted.