edge-to-edge

Migrate Android Jetpack Compose apps to adaptive edge-to-edge rendering with inset handling.

1|Updated Mar 17, 2026
One-click install
npx skills add https://github.com/premex-ab/claude-marketplace --skill edge-to-edge-premex-ab
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: edge-to-edge
Source: https://github.com/premex-ab/claude-marketplace/tree/main/plugins/android-edge-to-edge/skills/edge-to-edge
Command: npx skills add https://github.com/premex-ab/claude-marketplace --skill edge-to-edge-premex-ab

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents Android Jetpack Compose screens from having important UI covered or overlapped by the status bar, navigation bar, or IME (soft keyboard), and fixes legibility and insets behavior during edge-to-edge migration.

Core Features & Use Cases

  • Migrates to adaptive edge-to-edge: Adds enableEdgeToEdge and ensures each Activity and UI component follows safe drawing and correct inset handling.
  • Fixes IME and keyboard overlap: Ensures adjustResize and applies the right IME inset handling for TextField and related inputs.
  • Troubleshoots system bar styling and padding mistakes: Guides correct use of Scaffold/Material insets APIs, avoids double-padding, and handles navigation bar contrast requirements.

Quick Start

Ask the skill to migrate your Jetpack Compose app to adaptive edge-to-edge by outlining exactly what to change in each Activity, list/FAB layouts, and IME inset handling.

Frequently Asked Questions about edge-to-edge

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

FAQPage Schema
How do I migrate my Jetpack Compose app to edge-to-edge without UI overlapping the status bar?

To migrate Jetpack Compose to edge-to-edge, enable it per Activity and apply safe drawing insets using Scaffold or manual padding values to prevent status bar overlap. This ensures UI components respect system bars and maintain legibility across SDK 35+.

Why does my Compose TextField get covered by the keyboard after enabling edge-to-edge?

Compose TextField keyboard overlap occurs when IME insets are not applied correctly. Fix edge-to-edge keyboard overlap by setting adjustResize and applying proper IME inset handling so scrollable content shifts above the soft keyboard.

What is the best way to handle system insets in Compose Scaffold without double-padding?

Avoid Compose Scaffold double-padding by using a single inset application path like consumeWindowInsets or safe drawing padding. Correct Material insets API usage ensures padding is applied once, preventing layout inflation while keeping content clear of system bars.

Do I need to call enableEdgeToEdge on every Activity for SDK 35+ adaptation?

Yes, enabling edge-to-edge per Activity is required for SDK 35+ adaptation. Each Activity must independently call enableEdgeToEdge and configure its Compose components with correct system inset handling to ensure full-screen layouts function properly.

How do I apply window insets to FABs and lists during edge-to-edge migration?

Apply window insets to FABs and lists during edge-to-edge migration by using safe drawing padding or fitInside with WindowInsetsRulers. This positions floating elements and scrollable content correctly relative to the navigation bar and system edges.

Can I use manual safe padding instead of Scaffold for edge-to-edge inset handling?

Yes, you can use manual safe padding instead of Scaffold for edge-to-edge inset handling. Applying PaddingValues directly to your Compose components prevents system bar overlap, but you must ensure a single application path to avoid double-padding issues.