Jetpack Compose アルファ版を公開しました
2020年9月1日火曜日
この記事は Karen Ng による Android Developers Blog の記事 "Announcing Jetpack Compose Alpha!" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
8 月 26 日（日本時間 8 月 27 日）Jetpack Compose のアルファ版を公開しました。最新の UI ツールキット Jetpack Compose は、すべての Android プラットフォームで美しいアプリをすばやく簡単に構築するために設計されており、プラットフォーム API へのネイティブ アクセスを提供します。劇的に削減されたコード、インタラクティブなツール、そして直感的な Kotlin API を活用して、魅力あふれるアプリを作りましょう。
時間を節約し、少ないコードで成立するプログラミング言語と IDE、そして強力な UI フレームワークは、どんなアプリを開発する時でも必要です。Jetpack Compose は、皆さん（と私たち）の UI 構築の生産性を上げるために開発しました。
その最初の一歩が Android Jetpack でした。この一連のライブラリは、Android でデベロッパーが頻繁に直面する難しい問題を解決するために開発し、プラットフォームのあらゆるバージョンでアプリを確実に動作させ、高い品質を確保できるライブラリとなっています。現在、Google Play ストアのトップ 10,000 アプリの 84% で、いずれかの Jetpack ライブラリが使われています。
また、Kotlin も使用率が高く、現在トップ 1,000 アプリの 70% 以上、そして Android デベロッパーの 60% が Kotlin を使っています。Google Home アプリを例に挙げると、Kotlin を使うことでコードの行を 80% 削減できました。さらに、NullPointerException は過去の同期間と比べて 33% 減少しました。Duolingo も、Kotlin を導入することで平均 30% のコード行数の削減を実現しました。
Jetpack Compose は、大規模で高品質なアプリを構築できる API、直感的な言語、そしてリアクティブ プログラミング モデルを組み合わせたものです。 デベロッパーの皆さんから寄せられていた、シンプルな宣言型 API による UI の構築を希望するというフィードバックを実現しました。
Jetpack Compose アルファ版には一連の API が含まれており、強力なツールや、本格的な Android アプリの構築に必要なものがすべてそろっています。既存の Android ビューとの相互運用性も備えていますので、アプリを書き直す必要はありません。Compose API は、マテリアル デザインを使った正規のサンプルアプリのセットとともに設計、開発されています。このサンプルアプリのセットも 8 月 26 日に公開しましたので、Android Studio に直接インポートして試してみることができます。
Jetpack Compose アルファ版には、次のものが含まれています。
Compose でアプリを作りやすくするため、Jetbrains Kotlin チームとも連携して Android Studio 4.2 Canary 版にも多くの新機能を追加しています。
Compose は、Android の既存 UI 構築モデルとはまったく異なるプログラミング モデルを使用しています。Android ビューの階層は、当初から UI ウィジェットのツリーとして表現されています。アプリの状態が変更されると、現在のデータを表示するために UI 階層を更新する必要があります。UI を更新する場合は、findViewById() などの関数を使ってツリーから UI を検索し、button.setText(String) や container.addView(View)、img.setImageBitmap(Bitmap) などのメソッドを呼び出してノードを変更するのが一般的な方法です。これらのメソッドは、ウィジェットの内部状態を変更します。手動でビューを更新するという作業は、面倒であるだけでなく、エラーが起きる可能性も高くなります（例: ビューの更新を忘れる）。
Jetpack Compose では、完全に宣言的でコンポーネントベースのアプローチを採用しています。つまり、UI は、データを UI 階層に変換する関数として記述します。ベースとなるデータが変更されると、Compose フレームワークは自動的に UI 階層を更新します。そのため、UI をすばやく簡単に構築できます。
新しいフレームワークを採用すると、既存のプロジェクトやコードベースに大きな変更が発生します。そのため、Compose は Kotlin と同じくらい採用しやすいものとして設計しました。Compose は、既存の Android コードと完全に相互運用が可能で、すぐに使い始めることができます。
Compose への移行方法は、担当者やチームによってさまざまです。新しいアプリを構築する場合は、UI 全体を Compose で実装する方法が最適かもしれません。しかし、ほとんどの皆さんは既存の大きなコードベースを抱えているはずです。その場合は、アプリを書き直すよりも、既存の UI デザインに Compose を組み込む方がよいでしょう。
主に次の 2 つの方法を使用して、ビューベースの UI に Compose を組み込むことができます。
さらに、新しいライブラリ MDC Compose Theme Adapter も公開しています。これを使うと、Compose UI で既存のマテリアル コンポーネント テーマを再利用できます。
詳細については、既存のアプリで Compose を使うためのコードラボを試してみるか、次の 2 つのサンプルをご覧ください。
構築する UI をすばやく繰り返し試せるように、Jetpack Compose は Android Studio の強力なツールと組み合わせて利用できるように構築されています。
Compose レイアウト プレビューを使うと、端末やエミュレータにアプリをデプロイしなくても、Compose コンポーネントをプレビューできます。アプリに変更を加えると、プレビューが更新されてすばやく変更点を確認できます。レイアウト プレビューを作成するには、パラメータのない Composable 関数を作成して @Preview アノテーションを追加します。アプリをビルドすると、Studio のプレビュー ペインにプレビュー関数の UI が表示されます。
Android Studio では、インタラクティブ プレビュー モードを利用できます。インタラクティブ プレビュー モードでは、UI 要素のクリックや入力が可能です。UI はインストールしたアプリと同じように反応します。
また、Composable を単独で物理端末や Android Emulator にデプロイすることもできます。Android Studio は、新しいアクティビティを作成してその関数が生成した UI を追加し、端末のアプリにデプロイします。これにより、アプリ全体を再インストールしたりその場所に移動したりすることなく、実際の端末で UI を試すことができます。
Jetpack Compose を使ってみたい方は、Compose チュートリアル を試し、セットアップを行ってみてください。または、直接サンプルアプリを確認することもできます。これらのアプリを紹介している ‘Compose by Example’ の動画もご覧ください。
新しいコードラボやさらに充実したドキュメントなど、Compose 全般に関する情報を確認したい方は、Compose Pathway をご覧ください。
Jetpack Compose は、昨年のオープンソース化以降も引き続き多くの方から貴重なフィードバックをお寄せいただいています。また、バグの記録、 CLにも貢献してくださっています。現在の Jetpack Compose があるのは、皆さんのおかげです。本当にありがとうございました！
Compose は安定版 API に向けた作業やパフォーマンス最適化を行っている段階のため、まだ本番環境での利用は推奨されていません。ですが、ぜひお試しいただき、フィードバックをお寄せください。Kotlin Slack の #compose チャンネルで行われているディスカッションへの参加もお待ちしています。Compose 1.0 は、2021 年のリリースを予定しています。
ぜひ Compose を使ってみてください！
Reviewed by Yuichi Araki - Developer Relations Team and Hidenori Fujii - Google Play Developer Marketing, APAC
8 月 26 日（日本時間 8 月 27 日）Jetpack Compose のアルファ版を公開しました。最新の UI ツールキット Jetpack Compose は、すべての Android プラットフォームで美しいアプリをすばやく簡単に構築するために設計されており、プラットフォーム API へのネイティブ アクセスを提供します。劇的に削減されたコード、インタラクティブなツール、そして直感的な Kotlin API を活用して、魅力あふれるアプリを作りましょう。
時間を節約し、少ないコードで成立するプログラミング言語と IDE、そして強力な UI フレームワークは、どんなアプリを開発する時でも必要です。Jetpack Compose は、皆さん（と私たち）の UI 構築の生産性を上げるために開発しました。
その最初の一歩が Android Jetpack でした。この一連のライブラリは、Android でデベロッパーが頻繁に直面する難しい問題を解決するために開発し、プラットフォームのあらゆるバージョンでアプリを確実に動作させ、高い品質を確保できるライブラリとなっています。現在、Google Play ストアのトップ 10,000 アプリの 84% で、いずれかの Jetpack ライブラリが使われています。
また、Kotlin も使用率が高く、現在トップ 1,000 アプリの 70% 以上、そして Android デベロッパーの 60% が Kotlin を使っています。Google Home アプリを例に挙げると、Kotlin を使うことでコードの行を 80% 削減できました。さらに、NullPointerException は過去の同期間と比べて 33% 減少しました。Duolingo も、Kotlin を導入することで平均 30% のコード行数の削減を実現しました。
Jetpack Compose は、大規模で高品質なアプリを構築できる API、直感的な言語、そしてリアクティブ プログラミング モデルを組み合わせたものです。 デベロッパーの皆さんから寄せられていた、シンプルな宣言型 API による UI の構築を希望するというフィードバックを実現しました。
Jetpack Compose アルファ版
Jetpack Compose アルファ版には一連の API が含まれており、強力なツールや、本格的な Android アプリの構築に必要なものがすべてそろっています。既存の Android ビューとの相互運用性も備えていますので、アプリを書き直す必要はありません。Compose API は、マテリアル デザインを使った正規のサンプルアプリのセットとともに設計、開発されています。このサンプルアプリのセットも 8 月 26 日に公開しましたので、Android Studio に直接インポートして試してみることができます。
Jetpack Compose アルファ版には、次のものが含まれています。
- アニメーション
- Constraint Layout
- デフォルトでサポートされる A11Y
- 入力とジェスチャー操作
- ビューとの相互運用性（既存アプリで Composable 関数を利用可能）
- 遅延読み込みリスト
- マテリアル UI コンポーネント
- パフォーマンス最適化
- テスト
- テキストと編集可能テキスト
- テーマとグラフィック
- ウィンドウ管理
Compose でアプリを作りやすくするため、Jetbrains Kotlin チームとも連携して Android Studio 4.2 Canary 版にも多くの新機能を追加しています。
- Compose コード補完
- Compose プレビュー アノテーション
- 端末への Composable の個別デプロイ
- インタラクティブ Compose プレビュー
- コード生成用 Kotlin コンパイラ プラグイン
- Compose 用 Sample Data API
Compose の特長
Compose は、Android の既存 UI 構築モデルとはまったく異なるプログラミング モデルを使用しています。Android ビューの階層は、当初から UI ウィジェットのツリーとして表現されています。アプリの状態が変更されると、現在のデータを表示するために UI 階層を更新する必要があります。UI を更新する場合は、findViewById() などの関数を使ってツリーから UI を検索し、button.setText(String) や container.addView(View)、img.setImageBitmap(Bitmap) などのメソッドを呼び出してノードを変更するのが一般的な方法です。これらのメソッドは、ウィジェットの内部状態を変更します。手動でビューを更新するという作業は、面倒であるだけでなく、エラーが起きる可能性も高くなります（例: ビューの更新を忘れる）。
Jetpack Compose では、完全に宣言的でコンポーネントベースのアプローチを採用しています。つまり、UI は、データを UI 階層に変換する関数として記述します。ベースとなるデータが変更されると、Compose フレームワークは自動的に UI 階層を更新します。そのため、UI をすばやく簡単に構築できます。
既存の Android ビューとの完全な相互運用性
新しいフレームワークを採用すると、既存のプロジェクトやコードベースに大きな変更が発生します。そのため、Compose は Kotlin と同じくらい採用しやすいものとして設計しました。Compose は、既存の Android コードと完全に相互運用が可能で、すぐに使い始めることができます。
Compose への移行方法は、担当者やチームによってさまざまです。新しいアプリを構築する場合は、UI 全体を Compose で実装する方法が最適かもしれません。しかし、ほとんどの皆さんは既存の大きなコードベースを抱えているはずです。その場合は、アプリを書き直すよりも、既存の UI デザインに Compose を組み込む方がよいでしょう。
主に次の 2 つの方法を使用して、ビューベースの UI に Compose を組み込むことができます。
- Compose の要素を既存の UI に追加します。これは、まったく新しい Compose ベースの画面を作るか、Compose の要素を既存のフラグメントやビューによるレイアウトに追加することで実現します。
- Composable 関数にビューベースの UI 要素を追加します。この方法を使うと、MapView や WebView などの Compose 以外のウィジェットを Compose ベースのデザインに追加できます。
さらに、新しいライブラリ MDC Compose Theme Adapter も公開しています。これを使うと、Compose UI で既存のマテリアル コンポーネント テーマを再利用できます。
詳細については、既存のアプリで Compose を使うためのコードラボを試してみるか、次の 2 つのサンプルをご覧ください。
強力なツール
構築する UI をすばやく繰り返し試せるように、Jetpack Compose は Android Studio の強力なツールと組み合わせて利用できるように構築されています。
Compose レイアウト プレビューを使うと、端末やエミュレータにアプリをデプロイしなくても、Compose コンポーネントをプレビューできます。アプリに変更を加えると、プレビューが更新されてすばやく変更点を確認できます。レイアウト プレビューを作成するには、パラメータのない Composable 関数を作成して @Preview アノテーションを追加します。アプリをビルドすると、Studio のプレビュー ペインにプレビュー関数の UI が表示されます。
Android Studio では、インタラクティブ プレビュー モードを利用できます。インタラクティブ プレビュー モードでは、UI 要素のクリックや入力が可能です。UI はインストールしたアプリと同じように反応します。
また、Composable を単独で物理端末や Android Emulator にデプロイすることもできます。Android Studio は、新しいアクティビティを作成してその関数が生成した UI を追加し、端末のアプリにデプロイします。これにより、アプリ全体を再インストールしたりその場所に移動したりすることなく、実際の端末で UI を試すことができます。
Jetpack Compose を使ってみる
Jetpack Compose を使ってみたい方は、Compose チュートリアル を試し、セットアップを行ってみてください。または、直接サンプルアプリを確認することもできます。これらのアプリを紹介している ‘Compose by Example’ の動画もご覧ください。
新しいコードラボやさらに充実したドキュメントなど、Compose 全般に関する情報を確認したい方は、Compose Pathway をご覧ください。
Jetpack Compose は、昨年のオープンソース化以降も引き続き多くの方から貴重なフィードバックをお寄せいただいています。また、バグの記録、 CLにも貢献してくださっています。現在の Jetpack Compose があるのは、皆さんのおかげです。本当にありがとうございました！
Compose は安定版 API に向けた作業やパフォーマンス最適化を行っている段階のため、まだ本番環境での利用は推奨されていません。ですが、ぜひお試しいただき、フィードバックをお寄せください。Kotlin Slack の #compose チャンネルで行われているディスカッションへの参加もお待ちしています。Compose 1.0 は、2021 年のリリースを予定しています。
ぜひ Compose を使ってみてください！
Reviewed by Yuichi Araki - Developer Relations Team and Hidenori Fujii - Google Play Developer Marketing, APAC