skills.rest
ekawijayasusilo
ekawijayasusiloCOMMUNITY
Explore all skills by this author →
GitHub

edge-to-edge

Migrate Jetpack Compose Android apps to adaptive edge-to-edge layouts with system bar and IME inset handling.

Updated May 22, 2026
Search Tags:#android#jetpack compose#edge-to-edge#navigation bar#ime padding#system insets
One-click install
npx skills add https://github.com/ekawijayasusilo/kmp_template --skill edge-to-edge-ekawijayasusilo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: edge-to-edge
Source: https://github.com/ekawijayasusilo/kmp_template/tree/main/.claude/skills/edge-to-edge
Command: npx skills add https://github.com/ekawijayasusilo/kmp_template --skill edge-to-edge-ekawijayasusilo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you fix Jetpack Compose layouts that get obscured by status bars, navigation bars, and the on-screen keyboard, improving tap targets and visual clarity.

Core Features & Use Cases

  • Adaptive edge-to-edge migration: Adds enableEdgeToEdge to Activities and updates soft-input behavior to prevent keyboard overlap.
  • Correct system insets handling: Applies safe drawing and window inset padding so lists, FABs, and top/bottom bars render into the right areas without double padding.
  • IME (keyboard) troubleshooting: Ensures TextField and related inputs remain visible using WindowInsetsRulers.Ime.current, contentWindowInsets, or safe padding modifiers.

Use case: Your Compose app has a list and a search TextField, but when the keyboard opens the field is covered and the navigation bar overlays the bottom items; this Skill guides the required inset and IME fixes.

Quick Start

Ask an AI to apply the edge-to-edge migration steps to your Android Jetpack Compose project targeting Android 35+, updating each Activity, list/FAB padding, and IME handling to keep all content visible and legible.

Frequently Asked Questions about edge-to-edge

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

FAQPage Schema
How do I fix Jetpack Compose content being obscured by the status and navigation bars?▼

To fix Jetpack Compose content obscured by system bars, enable edge-to-edge on Activities and apply system insets via Scaffold content lambdas or safe padding modifiers to prevent overlap and ensure clear tap targets.

Why does the soft keyboard cover my TextField in Android Compose?▼

The soft keyboard covers TextField components when soft-input behavior is not set to adjustResize. Ensure parent layouts consume IME insets using WindowInsets.ime or safe drawing modifiers to keep inputs visible.

How do I apply edge-to-edge insets without causing double padding on FABs and lists?▼

Avoid double padding on FABs and lists by applying window inset padding exclusively through Scaffold content lambdas or targeted safe padding modifiers, ensuring scrollable components render into correct areas without redundant offsets.

Do I need to update Activity configurations to support edge-to-edge on Android 15+?▼

Yes, supporting edge-to-edge on Android 15+ requires updating Activity configurations by calling enableEdgeToEdge and adjusting soft-input behavior to handle system insets and IME padding correctly across adaptive layouts.

Related Skills

Explore More Software Engineering Skills→
Kaito-DogiKaito-Dogi

edge-to-edge

Migrate Android Jetpack Compose apps to support edge-to-edge displays.

Community
Intermediate
yash-gargyash-garg

edge-to-edge

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

Community
Advanced
androidandroid
6.6k

edge-to-edge

Migrates Jetpack Compose apps to adaptive edge-to-edge layouts with proper insets for bars and IME.

Official
Advanced
uyelikaniluyelikanil

edge-to-edge

Migrate Android Jetpack Compose apps to edge-to-edge layouts with WindowInsets.

Community
Advanced