Jetpack Compose は、Android のネイティブ UI を構築するための最新のツールキットです。このページには、Compose の使用に関する最新情報が記載されています。
基本コンセプト
- Compose の思想: Compose の宣言型アプローチが従来のビューベースのアプローチと異なる点、Compose を使用する場合のメンタルモデルの構築方法について確認します。
- 状態の管理: Compose アプリで状態を設定して使用する方法について確認します。
- コンポーザブルのライフサイクル: コンポーザブルのライフサイクルと、再描画が必要かどうかを Compose が決定する仕組みについて確認します。
- 修飾子: 修飾子を使用してコンポーザブルを装飾または拡張する方法について確認します。
- Compose の副作用: 副作用を管理するための最適な方法について確認します。
- Jetpack Compose のフェーズ: UI をレンダリングするために Compose を介して行う手順と、その情報を使用して効率的なコードを記述する方法について確認します。
- アーキテクチャのレイヤリング: Jetpack Compose を構成するアーキテクチャ レイヤと、その設計に影響を与えたコア原則について確認します。
- パフォーマンス: アプリのパフォーマンス低下の原因となる可能性がある一般的なプログラミングの落とし穴を回避する方法について確認します。
- Compose のセマンティクス: ユーザー補助サービスとテスト フレームワークで使用できるように UI を整理する、セマンティクス ツリーについて確認します。
- CompositionLocal でローカルにスコープ設定されたデータ:
CompositionLocalを使用して Composition を介してデータを渡す方法について確認します。
開発環境
- Android Studio で Compose を使用する: Compose を使用するための開発環境をセットアップします。
- Android Studio における Compose のサポート: Compose をサポートする Android Studio の新機能について確認します。
- Compose で Kotlin を使用する: Compose で Kotlin 固有のイディオムが動作する仕組みを確認します。
- デベロッパー エルゴノミクス: Compose に移行することで、アプリの APK サイズとランタイム パフォーマンスにどのような影響が出るかについて確認します。
設計
- レイアウト: Compose のネイティブ レイアウト コンポーネントと、独自のレイアウトを設計する方法について確認します。
- レイアウトの基本: シンプルなアプリ UI のビルディング ブロックについて確認します。
- マテリアル コンポーネントとレイアウト: Compose のマテリアル コンポーネントとレイアウトについて確認します。
- カスタム レイアウト: アプリのレイアウトを管理する方法や、自身のカスタム レイアウトを設計する方法について確認します。
- アダプティブ レイアウトを作成する: Compose を使用して、さまざまな画面サイズ、画面の向き、フォーム ファクタに対応するレイアウトを作成する方法について確認します。
- アライメント ライン: カスタム アライメント ラインを作成して UI 要素を正確に配置する方法について確認します。
- 固有の測定値: Compose では、UI 要素を 1 回のパスごとに 1 回しか測定できません。このページでは、測定前に子要素に関する情報をクエリする方法について説明します。
- ConstraintLayout: Compose UI で
ConstraintLayoutを使用する方法について確認します。
- デザイン システム: デザイン システムを実装する方法と、一貫性のあるアプリをデザインする方法について説明します。
- マテリアル デザイン 3: Compose のマテリアル デザイン 3 の実装によって Material You を実装する方法について説明します。
- マテリアル 2 からマテリアル 3 に移行する: Compose でアプリをマテリアル デザイン 2 からマテリアル デザイン 3 に移行する方法について説明します。
- マテリアル デザイン 2: プロダクトのブランドに合わせて、Compose のマテリアル デザイン 2 の実装をカスタマイズする方法について説明します。
- カスタム デザイン システム: Compose でカスタム デザイン システムを実装する方法と、カスタム デザイン システムを処理するために既存のマテリアル デザイン コンポーザブルを調整する方法について説明します。
- テーマの構造:
MaterialThemeとカスタム デザイン システムによって使用される下位レベルの構造と API について説明します。
- リストとグリッド: データのリストとグリッドの管理と表示を行うための Compose オプションについて説明します。
- テキスト: テキストの表示と編集を行うための主な Compose オプションについて確認します。
- グラフィック: カスタム グラフィックを作成して使用できる Compose の機能について確認します。
- アニメーション: UI 要素をアニメーション化するためのさまざまな Compose オプションについて確認します。
- 操作: ユーザーの操作を検出してやり取りを行う Compose UI をビルドする方法について確認します。
- ユーザー操作の処理: Compose が低レベルの入力を高レベルのインタラクションに抽象化する方法について確認し、コンポーネントがユーザー アクションに応答する方法をカスタマイズできるようにします。
Compose の導入
- 既存のアプリに Compose を導入する: 既存のアプリのアーキテクチャと UI に Compose を統合する方法について確認します。
- アプリに Compose を追加する: 既存のビューベースのアプリで Compose の使用を開始するための基本的な方法について確認します。
- 相互運用 API: Compose とビューベースの UI を組み合わせるために役立つ Compose の API について確認します。
- 既存のアーキテクチャでの Compose: アプリに Compose を導入する場合に、ビューと Compose ベースの UI を組み合わせる方法について確認します。
- 既存の UI での Compose: アプリの UI の Compose 部分と Compose 以外の部分でビューベースの UI 要素を共有する方法について確認します。
- Compose とその他のライブラリ: Compose コンテンツでビューベースのライブラリを使用する方法について確認します。
- Compose アーキテクチャ: Compose における単方向フローパターンの実装方法、イベントと状態ホルダーの実装方法、
ViewModelの使用方法について確認します。 - ナビゲーション:
NavControllerを使用してナビゲーションのコンポーネントを Compose UI に統合する方法について確認します。- レスポンシブ UI のナビゲーション: さまざまな画面サイズ、向き、フォーム ファクタに適応するようにアプリのナビゲーションを設計する方法について確認します。
- リソース: Compose コードでアプリのリソースを扱う方法について確認します。
- ユーザー補助: さまざまなユーザー補助要件を持つユーザーに合わせて Compose UI を作成する方法について確認します。
- テスト: Compose コードのテストについて確認します。
- テスト クイック リファレンス: Compose の便利なテスト API のクイック リファレンスです。