この記事は Jolanda Verhoef による Android Developers Blog の記事 "Creating custom Tiles on Wear OS by Google with the Jetpack Tiles library" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
Wear OS by Google スマートウォッチのタイルは、2019 年に導入されてから、特に便利で有用な機能になっています。タイルは高速にアクセスでき、使い勝手が良く、手首から必要な情報や作業にスワイプでアクセスできるように設計されています。さらに、ユーザーは確認したい情報やアクションを自由に操作できます。
2021 年 3 月 12 日（日本時間 3 月 13 日）に、Jetpack Tiles ライブラリがアルファ版になったことをお知らせします。このライブラリを使うと、デベロッパーは Wear OS スマートウォッチでカスタムタイルを作成できます。なお、対応する Wear OS プラットフォームのアップデートが今春にロールアウトされた後、ユーザーはカスタムタイルを利用できるようになります。
タイルは、日々の活動の進捗状況をトラッキングする、すばやくワークアウトを始める、最近聴いた曲を再生する、お気に入りの連絡先にメッセージを送信するなど、たくさんのユースケースに利用できます。アプリが没入的な体験を提供できる一方、タイルは高速に読み込めるので、ユーザーはすぐに行いたいことに集中できます。ユーザーがさらに情報を必要としているなら、タイルをタップしてスマートウォッチやスマートフォンで関連するアプリを開き、細かい処理を行うことができます。
タイルは Wear OS アプリの一部として、Android Studio で作成できます。最初に Wear OS Tiles への依存関係を追加します。
dependencies { implementation "androidx.wear:wear-tiles:1.0.0-alpha01" debugImplementation "androidx.wear:wear-tiles-renderer:1.0.0-alpha01" }
1 つ目の依存関係には、タイルの作成に必要なライブラリが含まれています。2 つ目の依存関係は、アクティビティでタイルをプレビューするためのものです。
次に、TileProviderService を使ってタイルの表示に必要な情報を提供します。
TileProviderService
class MyTileService : TileProviderService() { override fun onTileRequest(requestParams: RequestReaders.TileRequest) = Futures.immediateFuture(Tile.builder() .setResourcesVersion("1") .setTimeline(Timeline.builder().addTimelineEntry( // For more information about timelines, see the docs TimelineEntry.builder().setLayout( Layout.builder().setRoot( Text.builder().setText("Hello world!") ) ) ) ).build()) override fun onResourcesRequest(requestParams: ResourcesRequest) = Futures.immediateFuture(Resources.builder() .setVersion("1") .build() ) }
このコードには、重要な部分が 2 つあります。
onTileRequest()
TimelineEntry
onResourcesRequest()
タイルをプレビューするには、簡単なアクティビティを作成します。このアクティビティは、デバッグおよびプレビューのみに利用するので、src/main ではなく、src/debug に追加します。
src/main
src/debug
class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) val rootLayout = findViewById<FrameLayout>(R.id.tile_container) TileManager( context = this, component = ComponentName(this, MyTileService::class.java), parentView = rootLayout ).create() } }
以上でタイルを公開する準備が整います。さらに詳しい手順を知りたい方や、タイルについてのさらに詳しい情報を確認するには、新しいガイドと、サンプルタイルの実例をご覧ください。
Jetpack Tiles ライブラリはアルファ版なので、API を改善するためのフィードバックをお待ちしています。それでは、コーディングをお楽しみください。
Reviewed by Yuichi Araki - Developer Relations Team and Tamao Imura - Developer Marketing Manager, Platforms and Ecosystems
