To start providing tiles from your app, include the following dependencies in your app's file. Groovy dependencies { // Use to implement support for wear tiles implementation " // Use to utilize components and layouts with Material Design in your tiles implementation " // Use to preview wear tiles in your own app debugImplementation " // Use to fetch tiles from a tile provider in your tests testImplementation " } Kotlin dependencies { // Use to implement support for wear tiles implementation" // Use to utilize components and layouts with Material design in your tiles implementation" // Use to preview wear tiles in your own app debugImplementation" // Use to fetch tiles from a tile provider in your tests testImplementation" } Create a tile To provide a tile from your application, create a class that extends TileService and implement the methods, as shown in the following code sample Kotlin private val RESOURCES_VERSION = "1" class MyTileService TileService { override fun onTileRequestrequestParams = .setResourcesVersionRESOURCES_VERSION .setTimeline world!".setFontStyle .build .build .build .build .build override fun onResourcesRequestrequestParams ResourcesRequest = .setVersionRESOURCES_VERSION .build } Java public class MyTileService extends TileService { private static final String RESOURCES_VERSION = "1"; NonNull Override protected ListenableFuture onTileRequest NonNull TileRequest requestParams { return .setResourcesVersionRESOURCES_VERSION .setTimelinenew .addTimelineEntrynew .setLayoutnew .setRootnew .setText"Hello world!" .setFontStylenew .setColorargb0xFF000000.build .build .build .build .build .build ; } NonNull Override protected ListenableFuture onResourcesRequest NonNull ResourcesRequest requestParams { return .setVersionRESOURCES_VERSION .build ; } } Next, add a service inside the tag of your file. The permission and intent filter register this service as a tile provider. The icon, label, and description is shown to the user when they configure tiles on their phone or watch. Use the preview meta-data tag to show a preview of the tile when configuring it on your phone. Create UI for tiles The layout of a tile is written using a builder pattern. A tile's layout is built up like a tree that consists of layout containers and basic layout elements. Each layout element has properties, which you can set through various setter methods. Basic layout elements The following visual elements are supported Text renders a string of text, optionally wrapping. Image renders an image. Spacer provides padding between elements or can act as a divider when you set its background color. Material components In addition to basic elements, the tiles-material library provides components that ensure a tile design in line with Material Design user interface recommendations. Button clickable circular component designed to contain an icon. Chip clickable stadium-shaped component designed to contain up to two lines of text and an optional icon. CompactChip clickable stadium-shaped component designed to contain a line of text. TitleChip clickable stadium-shaped component similar to Chip but with a larger height to accomodate title text. CircularProgressIndicator circular progress indicator that can be placed inside a ProgressIndicatorLayout to display progress around the edges of the screen. Layout containers The following containers are supported Row lays child elements out horizontally, one after another. Column lays child elements out vertically, one after another. Box overlays child elements on top of one another. Arc lays child elements out in a circle. Spannable applies specific FontStyles to sections of text along with interleaving text and images. For more information, see Spannables. Every container can contain one or more children, which themselves can also be containers. For example, a Column can contain multiple Row elements as children, resulting in a grid-like layout. As an example, a tile with a container layout and two child layout elements could look like this Kotlin private fun myLayout LayoutElement = .setWidthwrap .setHeightexpand .setVerticalAlignmentVALIGN_BOTTOM .addContent .setText"Hello world" .build .addContent .setResourceId"image_id" .setWidthdp24f .setHeightdp24f .build .build Java private LayoutElement myLayout { return new .setWidthwrap .setHeightexpand .setVerticalAlignmentVALIGN_BOTTOM .addContentnew .setText"Hello world" .build .addContentnew .setResourceId"image_id" .setWidthdp24f .setHeightdp24f .build .build; } Material layouts In addition to basic layouts, the tiles-material library provides a few opinionated layouts made to hold elements in specific "slots". PrimaryLayout positions a single primary action CompactChip at the bottom with the content centered above it. MultiSlotLayout positions primary and secondary labels with optional content in between and an optional CompactChip at the bottom. ProgressIndicatorLayout positions a CircularProgressIndicator around the edges of the screen and the given content inside. Arcs The following Arc container children are supported ArcLine renders a curved line around the Arc. ArcText renders curved text in the Arc. ArcAdapter renders a basic layout element in the arc, drawn at a tangent to the arc. For more information, see the reference documentation for each of the element types. Modifiers Every available layout element can optionally have modifiers applied to it. Use these modifiers for the following purposes Change the visual appearance of the layout. For example, add a background, border, or padding to your layout element. Add metadata about the layout. For example, add a semantics modifier to your layout element for use with screen readers. Add functionality. For example, add a clickable modifier to your layout element to make your tile interactive. For more information, see Interact with the tile. For example, we can customize the default look and metadata of an Image, as shown in the following code sample Kotlin private fun myImage LayoutElement = .setWidthdp24f .setHeightdp24f .setResourceId"image_id" .setModifiers .setBackground .setPadding .setSemantics .setContentDescription"Image description" .build .build .build Java private LayoutElement myImage { return new .setWidthdp24f .setHeightdp24f .setResourceId"image_id" .setModifiersnew .setBackgroundnew .setPaddingnew .setSemanticsnew .setContentDescription"Image description" .build .build .build; } Spannables A Spannable is a special type of container that lays out elements similarly to text. This is useful when you want to apply a different style to only one substring in a larger block of text, something that isn't possible with the Text element. A Spannable container is filled with Span children. Other children, or nested Spannable instances, aren't allowed. There are two types of Span children SpanText renders text with a specific style. SpanImage renders an image inline with text. For example, you could italicize “world” in a "Hello world" tile and insert an image between the words, as shown in the following code sample Kotlin private fun mySpannable LayoutElement = .addSpan .setText"Hello " .build .addSpan .setWidthdp24f .setHeightdp24f .setResourceId"image_id" .build .addSpan .setText"world" .setFontStyle .setItalictrue .build .build .build Java private LayoutElement mySpannable { return new .addSpannew .setText"Hello " .build .addSpannew .setWidthdp24f .setHeightdp24f .setResourceId"image_id" .build .addSpannew .setText"world" .setFontStyle .setItalictrue .build .build .build; } Work with resources Tiles don't have access to any of your app's resources. This means that you can't pass an Android image ID to an Image layout element and expect it to resolve. Instead, override the onResourcesRequest method and provide any resources manually. There are two ways to provide images within the onResourcesRequest method Provide a drawable resource using setAndroidResourceByResId. Provide a dynamic image as a ByteArray using setInlineResource. Kotlin override fun onResourcesRequest requestParams ResourcesRequest = .setVersion"1" .addIdToImageMapping"image_from_resource", .setAndroidResourceByResId .setResourceId .build .build .addIdToImageMapping"image_inline", .setInlineResource .setDataimageAsByteArray .setWidthPx48 .setHeightPx48 .setFormat .build .build .build Java Override protected ListenableFuture onResourcesRequest NonNull ResourcesRequest requestParams { return new .setVersion"1" .addIdToImageMapping"image_from_resource", new .setAndroidResourceByResIdnew .setResourceId .build .build .addIdToImageMapping"image_inline", new .setInlineResourcenew .setDataimageAsByteArray .setWidthPx48 .setHeightPx48 .setFormat .build .build .build ; }