https://developer.android.com/agents/skills/jetpack-compose/adaptive/skill

Implement adaptive Jetpack Compose UI patterns for multi-window and large-screen form factors.

5|Updated Feb 22, 2026
One-click install
npx skills add https://github.com/fornewid/android-developers-changelog --skill https-developer-android-com-agents-skills-jetpack-compose-adaptive-skill
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: https://developer.android.com/agents/skills/jetpack-compose/adaptive/skill
Source: https://github.com/fornewid/android-developers-changelog/tree/main/docs/agents/skills/jetpack-compose/adaptive
Command: npx skills add https://github.com/fornewid/android-developers-changelog --skill https-developer-android-com-agents-skills-jetpack-compose-adaptive-skill

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you update a Jetpack Compose app so its navigation, layouts, lists, and app bars work well across phone, tablet, foldables, and other form factors.

Core Features & Use Cases

  • Verify UI coverage with screenshot tests to prevent regressions on multiple device sizes.
  • Adapt navigation for large screens by migrating bottom navigation to Material adaptive navigation scaffolds and keeping existing show/hide behavior.
  • Create multi-pane layouts using Navigation 3 SceneStrategy for list-detail and supporting-pane relationships without using legacy adaptive scaffolds.
  • Make vertical content adaptive with column-based grids by migrating lazy lists to adaptive grids and addressing experimental Grid usage.
  • Hide app bars on scroll per destination using the correct scroll behaviors so each top-level destination manages its own app bar independently.

Quick Start

Use the adaptive skill to migrate your Jetpack Compose app to adaptive navigation, multi-pane layouts (Navigation 3 Scenes), adaptive columns for vertical lists, and per-destination app bar scroll behavior.

Frequently Asked Questions about https://developer.android.com/agents/skills/jetpack-compose/adaptive/skill

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I make Jetpack Compose UI adaptive for tablets and foldables?

Migrating bottom navigation to Material adaptive navigation suite scaffolds adapts Jetpack Compose navigation for large screens. This approach maintains existing show and hide behavior while scaling navigation for tablets and foldables.

How do I create multi-pane layouts in Jetpack Compose without legacy adaptive scaffolds?

Creating multi-pane layouts in Jetpack Compose uses Navigation 3 SceneStrategy to configure list-detail and supporting-pane relationships. This modern approach replaces legacy adaptive scaffolds for responsive multi-window form factors.

How do I migrate vertical lazy lists to adaptive grids in Jetpack Compose?

Migrating vertical lazy lists to adaptive grids in Jetpack Compose involves switching to column-based grids. This addresses experimental Grid usage to make vertical content adaptive across different screen sizes.

Does this adaptive Compose approach require specific UI testing?

This adaptive Compose approach requires screenshot-based UI verification to prevent regressions. Screenshot testing checks UI coverage across multiple device sizes to ensure responsive behavior works correctly on phones, tablets, and foldables.

How do I hide app bars on scroll per destination in Compose?

Hiding app bars on scroll per destination in Compose requires applying correct scroll behaviors. This ensures each top-level destination manages its own app bar independently without affecting other navigation destinations.