Introducing Slice Builders KTX

Android KTX is collection of libraries that wrap existing AndroidX and Android Platform APIs in a Kotlin-friendly interface. One of the latest as of this post is Slice Builders KTX, launched as part of the AndroidX 1.0.0-alpha3 push on June 6th, 2018.

What are Slice Builders?

Slices is a new API introduced in AndroidX 1.0.0, backwards compatible to API 19. Slices provide interactive, dynamic, and rich content from your app that will be displayed from within the Google Search app and later in other places like the Google Assistant. For now, you can test your Slices using the Slice Viewer app.

Slice Viewer showing a list of Slices

To build and expose a Slice, selectFile -> New -> Other -> Slice Provider. This declares a SliceProvider as a <provider> in your AndroidManifest.xml and adds a SliceProvider subclass to your project. Here’s an example implementation:

In order to build the Slice object, you need to use the Slice Builders API. Add the following to the dependencies in your app module’s build.gradle:

implementation androidx.slice:slice-builders:<current version>

The following is an example for building a Hello World Slice surfaced by the /hello URI path:

For a more complete description of the API, check out g.co/slices, the Getting Started guide, and the deeper dive into Slice builders.

How will KTX simplify building Slices in Kotlin?

With Slice Builders KTX, we wrap the builder pattern in a Kotlin friendly DSL to improve conciseness and readability. Let’s see what it looks like in action:

First, modify your build.gradle to replace the `slice-builders` dependency with `slice-builders-ktx`:

implementation androidx.slice:slice-builders-ktx:<current version>

Then, modify your buildSlice method to use the DSL:

Let’s look at the snippet step by step:

  1. list(…) { … } instantiates a ListBuilder and calls ListBuilder#build() when the lambda is finished running.
  2. row { … } is inside the list(…) { … } lambda, which means it is instantiated and added to the outer ListBuilder.
  3. setTitle(“Hello world”) is inside the row {…} lambda which means it’s setting the title of the row to “Hello world”.

There are more templates in the builders API that are mapped to a DSL wrapper. Here is the list at the time of this post:

  • Add a new ListBuilder and build() it at the end -> list
  • Add a new HeaderBuilder to a ListBuilder -> header
  • Add a new RowBuilder to a ListBuilder -> row
  • Add a new GridRowBuilder to a ListBuilder -> gridRow
  • Add a new CellBuilder to a GridRowBuilder -> cell
  • Add a new InputRangeBuilder to a ListBuilder -> inputRange
  • Add a new RangeBuilder to a ListBuilder -> range

Additionally, there are some helper methods for creating a “See More” RowBuilder and a “See More” CellBuilder. Use these instead of the normal “row” and “cell” when the row or cell is the last in the list (or gridRow) and is meant to be tapped to “see more”:

  • Add a new “See More” RowBuilder to a ListBuilder -> seeMoreRow
  • Add a new “See More” CellBuilder to a GridRowBuilder -> seeMoreCell

Here’s another example that includes GridRowBuilders, CellBuilders, and a HeaderBuilder:

Here is the output of the above example:

SliceViewer showing the Slice generated by the buildSlice() function snippet above.

In Summary

If you have already adopted Kotlin in your code base, we highly recommend you migrate (or start) building your Slices using KTX. Learn how to build your own DSL in my next post!