android-compose-foundations

Android Compose の基礎

使用する場合

• 次の内容に関するリクエストでこのスキルを使用します：Jetpack Compose の画面、Android の Compose レイアウト、Compose の Modifier の整理。
• 主な成果：Jetpack Compose の基礎、レイアウト、Modifier、テーマ設定、安定したコンポーネント構造を使用して Android UI を構築します。
• 対象範囲が広がる場合の引き継ぎ先スキル：
• android-compose-state-effects
• android-material3-design-system

ワークフロー

1. 対象の画面が Compose、View システム、または両者の相互運用画面のどれに該当するかを特定します。
2. 応答性、アクセシビリティ、パフォーマンスの要件を満たす、最も導入しやすい UI パターンを選択します。
3. 安定した状態、明示的な副作用、再利用可能なデザイントークンを中心に UI を構築します。
4. フィクスチャアプリで、長いテキスト、フォントの拡大、RTL、狭いデバイスなどのエッジケースを検証します。
5. 引き継ぐ前に、ユニットテスト、UI テスト、スクリーンショットに対応したチェックで検証します。

ガードレール

• アニメーションや抽象化を加える前に、安定した状態と予測可能な描画を優先します。
• デフォルトで、アクセシビリティのセマンティクス、コントラスト、フォーカス順序、タッチターゲットのガイドラインを遵守します。
• 明確な相互運用の境界がないまま、Compose と View システムの責務を混在させないでください。
• 時期尚早なマイクロ最適化ではなく、測定に基づくパフォーマンス改善を優先します。

アンチパターン

• ナビゲーションやビジネスロジックを末端の UI コンポーネントに直接埋め込むこと。
• ローカライズや動的なテキスト表示で崩れる固定寸法を使用すること。
• セマンティクスを無視し、視覚的な変化だけを通知すること。
• XML のパターンを、考え方を適応させずに Compose にそのまま移植すること。

例

想定どおりの場合

• シナリオ：安定したスロットとテーマトークンを使って、Compose の OrbitTasks ボードを改善します。
• コマンド：cd examples/orbittasks-compose && ./gradlew :app:testDebugUnitTest

エッジケース

• シナリオ：幅が狭い場合や長いテキストがある場合も、プレビューとレイアウトの動作を安定させます。
• コマンド：cd examples/orbittasks-compose && ./gradlew :app:assembleDebug

障害からの復旧

• シナリオ：一般的な Compose のリクエストが、状態や副作用、パフォーマンスの作業に逸れないようにします。
• コマンド：python3 scripts/eval_triggers.py --skill android-compose-foundations

完了チェックリスト

• 実装方針が明確かつ最小限で、適切な Android の画面に沿っています。
• 関連するサンプルコマンドとベンチマーク用プロンプトを実行するか、更新しています。
• リクエストが境界をまたぐ場合は、関連するスキルへの引き継ぎを記録しています。
• 選択したパターンと、主な移行方法またはトラブルシューティング手順を公式リファレンスで確認できます。

公式リファレンス

• https://developer.android.com/develop/ui/compose
• https://developer.android.com/develop/ui/compose/layouts/basics
• https://developer.android.com/develop/ui/compose/modifiers
• https://developer.android.com/develop/ui/compose/designsystems/material3