# Migrate Xml Views To Jetpack Compose

Provides a structured workflow for migrating an Android XML View to Jetpack Compose.

- 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 migrate-xml-views-to-jetpack-compose -g -a claude-code -y`
Codex: `npx skills add android/skills --skill migrate-xml-views-to-jetpack-compose -g -a codex -y`
Cursor: `npx skills add android/skills --skill migrate-xml-views-to-jetpack-compose -g -a cursor -y`
Gemini CLI: `npx skills add android/skills --skill migrate-xml-views-to-jetpack-compose -g -a gemini-cli -y`
Claude Code plugin marketplace: `/plugin marketplace add android/skills`

## Description

Provides a structured workflow for migrating an Android XML View to Jetpack Compose. This skill details the step-by-step process, from planning and dependency setup, to theming and layout migration, validation and XML cleanup. Use this skill when you need to migrate an XML View to Jetpack Compose in an Android project. It solves the problem of converting the UI of a legacy XML View into modern, declarative Compose components while maintaining interoperability.

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

This skill guides through the process of migrating an existing Android XML View
to Jetpack Compose. It performs a stable, safe and visually consistent
transition by following a structured, 10-step methodology. This skill migrates
UI (XML to Jetpack Compose) only.

## Objective

To systematically convert a single legacy XML layout into modern, declarative
Jetpack Compose UI while maintaining pixel-perfect visual parity and functional
integrity.

## Summary of the 10-step migration process

1. **Identify the optimal XML candidate for migration**
2. **Analyze the project and layout**
3. **Create a plan**
4. **Capture the XML View UI**
5. **Set up Compose dependencies and compiler**
6. **Set up Compose theming**
7. **Migrate the XML layout to Compose**
8. **Validate the migration**
9. **Replace usages**
10. **XML code removal**

## Detailed steps

### Step 1: Identify the optimal XML candidate for migration

If the user has explicitly specified a target XML layout, proceed to Step 2.
Otherwise, analyze the codebase to identify the best candidate for migration by
following the logic in [references/identify-optimal-xml-candidate.md](references/identify-optimal-xml-candidate.md).

### Step 2: Analyze the project and layout

Analyze the identified XML View's structure, hierarchy, and implementation
details.
Use [references/analysis-of-the-project-and-layout.md](references/analysis-of-the-project-and-layout.md) to
guide your technical audit of the layout and surrounding project context.

### Step 3: Create a plan

Using the outputs and analysis done in the Step 1 and 2, generate a
step-by-step plan for the migration. If you support user interaction, present
to the user and ask for approval before proceeding. If user interaction is not
supported, proceed to Step 4 following the generated plan.

### Step 4: Capture the XML View UI

The rest: https://github.com/android/skills/blob/HEAD/jetpack-compose/migration/migrate-xml-views-to-jetpack-compose/SKILL.md