Guide · Agent skill
How to use the Edge-to-Edge Layout Fixer agent skill
Updated · written with AI from the project's own documentation and checked against our catalogue data
The edge-to-edge skill (skill name edge-to-edge, from android/skills under Apache-2.0) gives an AI coding agent Google's recommended steps for moving an Android Jetpack Compose app to edge-to-edge display, where content runs behind the status bar and navigation bar. It is for Android developers migrating a Compose app, and for anyone debugging buttons, lists or text fields that sit under system bars or the on-screen keyboard. After this guide you will know what the skill changes, how to install it, how to ask for it in plain language, and what to check afterwards.
Quick start
- 1Check the prerequisites. Confirm your app uses Jetpack Compose and can target SDK 35 or later. Apps built only with Views or XML layouts are not a fit.
- 2Download the ZIP. Download the skill ZIP from this page.
- 3Install the skill. Unzip it into ~/.claude/skills/ for all projects, or into your project's .claude/skills/ folder for one project. Alternatively, upload it under Settings → Capabilities → Skills in the Claude apps.
- 4Ask for the migration. Describe the goal in plain language, for example asking the agent to migrate the Compose app to edge-to-edge.
- 5Review the changes. Check the enableEdgeToEdge calls, the adjustResize manifest entries and the padding or inset modifiers the agent added.
- 6Test on a device. Run the app and check that buttons, lists, FABs and text fields are reachable with the system bars and keyboard showing.
What is an agent skill?
An agent skill is a folder of instructions that an AI agent can load when a task matches it. This one is delivered as a single file, SKILL.md, which describes the steps the agent should follow.
What does the edge-to-edge skill make the agent do?
The skill walks the agent through three stages: planning, adding edge-to-edge support, and applying insets. In the planning stage the agent finds your Activities, lists, floating action buttons (FABs) and text fields, and notes which already handle edge-to-edge.
In the support stage it adds enableEdgeToEdge before setContent in onCreate for each Activity that does not already call it, and adds android:windowSoftInputMode="adjustResize" in AndroidManifest.xml for Activities that use a soft keyboard.
In the insets stage it applies padding or inset modifiers so critical UI stays tappable and input fields are not hidden by the keyboard. The skill also covers fixing system bar legibility.
- Prerequisite: the project must use Jetpack Compose.
- Prerequisite: the project must target SDK 35 or later. If it is lower, the skill raises it to 35.
- Prefers Scaffold PaddingValues, Material component inset handling, and safeDrawingPadding for components outside a Scaffold.
How do you install the skill?
Download the ZIP from our page and unzip it. To make it available across your projects, unzip it into ~/.claude/skills/. To make it available only in one project, unzip it into that project's .claude/skills/ folder.
You can also upload it in the Claude apps under Settings → Capabilities → Skills.
- Personal install: ~/.claude/skills/
- Project install: .claude/skills/ inside your project
How do you trigger the skill with a natural request?
You do not need a special command. Describe the problem or goal in plain language, mentioning Jetpack Compose so the agent knows the framework. The skill's description covers migrating to edge-to-edge and fixing components obscured by the navigation or status bar, IME insets, and system bar legibility.
- Migrate this Jetpack Compose app to edge-to-edge.
- The submit button in my Compose screen is hidden behind the navigation bar. Fix it.
- My OutlinedTextField is covered by the keyboard. Check the IME insets.
What does a typical fix look like?
For a screen built with Scaffold, the preferred pattern is to pass innerPadding to the content and consume it. The skill's example applies it to a LazyColumn, using contentPadding for the list.
For a button outside a Scaffold, the skill uses safeDrawingPadding on a Box and aligns the button within it.
Scaffold { innerPadding ->
LazyColumn(
modifier = Modifier
.fillMaxSize()
.consumeWindowInsets(innerPadding),
contentPadding = innerPadding
) { /* Content */ }
}What does the skill need and what are its safety notes?
You need an Android project that uses Jetpack Compose, with Android SDK target 35 or later, and something to edit it with, such as Android Studio or a Gradle-based project. The skill does not run scripts and does not use the network, according to its listing.
Because the skill edits your code, review its changes in version control before you commit them. Review the IME and Scaffold choices in particular, since the skill's own examples warn that applying IME padding twice causes excess space.
- Runs scripts: no
- Uses network: no
- Licence: Apache-2.0; the full terms are in LICENSE.txt
Tips for better results
Give the agent a specific screen or Activity name, and say what is hidden (a button, a list, a text field). This keeps the planning step focused.
If a text field is hidden by the keyboard, make sure the Activity has android:windowSoftInputMode="adjustResize" in its manifest entry. The skill notes that SOFT_INPUT_ADJUST_RESIZE is deprecated, so the manifest attribute is the approach to use.
What people use it for
- Migrating a Jetpack Compose app so screens draw behind the status bar and navigation bar.
- Fixing a button or FAB hidden under the navigation bar.
- Making a list's last items reachable by adding contentPadding from Scaffold.
- Fixing a login or form field hidden by the on-screen keyboard.
Frequently asked questions
How do I install the edge-to-edge agent skill?
Download the ZIP from this page and unzip it into ~/.claude/skills/ to use it everywhere, or into a project's .claude/skills/ folder to use it in one project. You can also upload it in the Claude apps under Settings → Capabilities → Skills.
What does the edge-to-edge skill require?
It requires an Android project that uses Jetpack Compose and targets SDK 35 or later. If the SDK is lower, the skill raises it to 35. It also needs Android Studio or a Gradle-based project to edit.
Does the skill work with Views or XML layouts?
No. The skill requires Jetpack Compose, so its instructions will not apply to apps built only with Views or XML layouts.
Is the edge-to-edge skill free?
It is licensed under Apache-2.0, and the complete terms are in LICENSE.txt. This page does not list any price.
Does the skill run scripts or use the internet?
According to its listing, it runs no scripts and uses no network. It works by editing your project files.
Why is my text field still hidden by the keyboard after using the skill?
Check that the Activity has android:windowSoftInputMode="adjustResize" in AndroidManifest.xml and that IME padding is not applied twice. The skill warns that combining contentWindowInsets with imePadding causes excess padding, so review the Scaffold code it wrote.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use this skill if you are migrating a Jetpack Compose app to edge-to-edge or chasing buttons, lists or text fields hidden by system bars and the keyboard. Skip it if your app uses Views or XML layouts, or if you cannot raise the target SDK to 35, since the prerequisites would block the migration.
Download the skill