# Edge To Edge

Use this skill to migrate your Jetpack Compose app to add adaptive edge-to-edge support...

- Repository: https://github.com/android/skills (10219 stars)
- Category: Design
- License: Complete terms in LICENSE.txt
- Last updated: 2026-10-29
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add android/skills --skill edge-to-edge -g -a claude-code -y`
Codex: `npx skills add android/skills --skill edge-to-edge -g -a codex -y`
Cursor: `npx skills add android/skills --skill edge-to-edge -g -a cursor -y`
Gemini CLI: `npx skills add android/skills --skill edge-to-edge -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add android/skills`

## Description

Use this skill to migrate your Jetpack Compose app to add adaptive edge-to-edge support and troubleshoot common issues. Use this skill to fix UI components (like buttons or lists) that are obscured by or overlapping with the navigation bar or status bar, fix IME insets, and fix system bar legibility.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

## Prerequisites

- Project **MUST** use Android Jetpack Compose.
- Project **MUST** target SDK 35 or later. If the SDK is lower than 35, increase the SDK to 35.

## Step 1: plan

1. Locate and analyze all Activity classes to detect which have existing edge-to-edge support. For every Activity without edge-to-edge, plan to make each Activity edge-to-edge.
2. In each Activity, Locate and analyze all lists and FAB components to detect which have existing edge-to-edge support. For every component without edge-to-edge support, plan to make each of these components edge-to-edge.
3. In each Activity, scan for `TextField`, `OutlinedTextField`, or `BasicTextField`. If found, then you **MUST** verify the IME doesn't hide the input field by following the IME section of this skill.

## Step 2: add edge-to-edge support

1. Add `enableEdgeToEdge` before `setContent` in `onCreate` in each Activity that does not already call `enableEdgeToEdge`.
2. Add `android:windowSoftInputMode="adjustResize"` in the AndroidManifest.xml for all Activities that use a soft keyboard.

## Step 3: apply insets

- The app **MUST** apply system insets, or align content to rulers, so critical
  UI remains tappable. Choose only one method to avoid double padding:

  1. **PREFERRED:** When available, use `Scaffold`s and pass `PaddingValues` to the content lambda.


  ```kotlin
  Scaffold { innerPadding ->
      // innerPadding accounts for system bars and any Scaffold components
      LazyColumn(
          modifier = Modifier
              .fillMaxSize()
              .consumeWindowInsets(innerPadding),
          contentPadding = innerPadding
      ) { /* Content */ }
  }
  ```

  <br />

  1. **PREFERRED:** When available, use the automatic inset handling or padding modifiers in material components.

The rest: https://github.com/android/skills/blob/HEAD/system/edge-to-edge/SKILL.md