skills.rest
piyushverma0
piyushverma0COMMUNITY
Explore all skills by this author →
WebsiteGitHub

adaptive-ui

Provide adaptive UI guidelines for Android apps across devices and WindowSizeClass breakpoints.

14|Updated Mar 14, 2026
Search Tags:#android#adaptive-ui#grid-layout#responsive-layout#foldables#window-size-class#dialog-adaptation
One-click install
npx skills add https://github.com/piyushverma0/android-agent-skills --skill adaptive-ui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: adaptive-ui
Source: https://github.com/piyushverma0/android-agent-skills/tree/main/skills/adaptive-ui
Command: npx skills add https://github.com/piyushverma0/android-agent-skills --skill adaptive-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Android apps often fail to adapt across phones, tablets, foldables, and Chromebooks. This skill provides a cohesive set of rules and patterns to ensure every screen renders correctly on any device, avoiding layout inconsistencies and wasted tokens on manual adjustments.

Core Features & Use Cases

  • Responsive scaffolds: NavigationSuiteScaffold, ListDetailPaneScaffold, and SupportingPaneScaffold to automatically adapt navigation and layouts across breakpoints.
  • Window-aware design: 3 layout tiers based on WindowSizeClass (compact, medium, expanded) with adaptive grids, paddings, and content widths.
  • Foldable & multi-pane support: handle folding states, hinge orientations, and remote pane configurations for a seamless user experience on foldables and large screens.

Quick Start

Apply the 10 adaptive UI rules to ensure every screen looks correct across devices.

Frequently Asked Questions about adaptive-ui

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

FAQPage Schema
How do I build responsive layouts for Android foldables and tablets?▼

To build responsive layouts for Android foldables and tablets, apply WindowSizeClass breakpoints alongside NavigationSuiteScaffold and ListDetailPaneScaffold to automatically adapt navigation and panes across compact, medium, and expanded screens.

What is WindowSizeClass and how does it structure adaptive UI?▼

WindowSizeClass is an Android breakpoint system that structures adaptive UI into three tiers: compact, medium, and expanded. It governs adaptive grids, paddings, and content widths to ensure correct rendering across phones, tablets, and Chromebooks.

How do I handle foldable hinge orientations and multi-pane configurations?▼

Handle foldable hinge orientations and multi-pane configurations by using SupportingPaneScaffold to manage folding states and remote pane setups. This ensures a seamless user experience on foldable devices and large screens.

Does this adaptive UI approach support Chromebooks and large screen devices?▼

Yes, this adaptive UI approach supports Chromebooks and large screen devices. It enforces accessible content width constraints and responsive scaffolds to make Android apps render correctly across phones, tablets, foldables, and Chromebooks.

What are the best ways to adapt dialogs and navigation for large Android screens?▼

The best ways to adapt dialogs and navigation for large Android screens involve using NavigationSuiteScaffold for responsive navigation and applying adaptive dialog patterns. These ensure interfaces scale correctly across different WindowSizeClass breakpoints.

Related Skills

Explore More Software Engineering Skills→
Kaito-DogiKaito-Dogi

adaptive

Adapt Android UIs with Jetpack Compose MediaQuery for responsive layouts and navigation.

Community
Intermediate
rock-hurock-hu

xml-to-compose-migration

Convert Android XML layouts to Jetpack Compose equivalents.

Community
Intermediate
lionheartapplionheartapp

mobile-android-design

Design and implement Material Design 3 interfaces with Jetpack Compose.

Community
Intermediate
kvithayathilkvithayathil

android-layouts

Optimize Android XML and Compose layouts for performance and structure.

Community
Intermediate