migrate-xml-views-to-jetpack-compose

Migrates Android XML View layouts to Jetpack Compose through a structured ten-step workflow.

3|Updated Aug 4, 2024
One-click install
npx skills add https://github.com/kabindra-shrestha/Clean-Architecture-Kotlin-Compose-Multiplatform --skill migrate-xml-views-to-jetpack-compose-kabindra-shrestha
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migrate-xml-views-to-jetpack-compose
Source: https://github.com/kabindra-shrestha/Clean-Architecture-Kotlin-Compose-Multiplatform/tree/main/.agents/skills/jetpack-compose/migration/migrate-xml-views-to-jetpack-compose
Command: npx skills add https://github.com/kabindra-shrestha/Clean-Architecture-Kotlin-Compose-Multiplatform --skill migrate-xml-views-to-jetpack-compose-kabindra-shrestha

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Converting legacy Android XML layouts to Jetpack Compose by hand is error-prone and often causes visual regressions, broken theming, and interoperability issues. This Skill provides a structured, repeatable 10-step methodology that takes a single XML layout from candidate selection through dependency setup, theming, code conversion, validation, and safe XML removal. ## Core Features & Use Cases - Guided 10-step migration workflow: Covers candidate identification, project analysis, planning, baseline screenshot capture, Compose dependency and compiler setup, theming migration, layout conversion, usage replacement, visual validation, and XML cleanup. - Interoperability guidance: Includes references for embedding Compose in Views (ComposeView, ViewCompositionStrategy) and Views in Compose (AndroidView, AndroidViewBinding, AndroidFragment) to support incremental adoption. - Theming and design system migration: Maps XML colors, shapes, typography, and styles to Material 3 Compose equivalents while preserving existing theme values as the source of truth. - Use Case: An Android developer needs to modernize a legacy screen incrementally. The Skill identifies the simplest leaf layout, captures a baseline screenshot, generates an equivalent composable with a Preview, validates visual parity, and removes the old XML safely. ## Quick Start Ask the assistant to migrate a specific XML layout file in your Android project to Jetpack Compose using this migration skill.

Frequently Asked Questions about migrate-xml-views-to-jetpack-compose

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

FAQPage Schema
How do I migrate an XML layout to Jetpack Compose?

Follow a structured process: analyze the XML hierarchy, set up Compose dependencies and the compiler plugin, migrate theming to Material 3, convert the layout to composables with matching modifiers, then validate against a baseline screenshot before deleting the XML.

Which XML layouts should I migrate to Compose first?

Start with leaf-node layouts that have minimal nesting, few state variables, low reuse across the project, and no external UI dependencies. Stateless, self-contained components carry the lowest regression risk during incremental migration.

Can I use Compose inside an existing View-based layout?

Yes, add a ComposeView to your XML layout and call setContent() with your composable. Set an appropriate ViewCompositionStrategy, such as DisposeOnViewTreeLifecycleDestroyed for Fragments, to avoid state loss.

How do I embed an Android View inside Compose UI?

Use the AndroidView composable with a factory lambda that creates the View and an update callback for state changes. For XML layouts with view binding enabled, use AndroidViewBinding from the ui-viewbinding library.

How do I migrate XML themes to Compose Material 3?

Map XML color attributes to Material 3 semantic roles like primary and surface, then define ColorScheme, Typography, and Shapes objects for MaterialTheme. Always reuse existing XML theme values as the source of truth and never hardcode new values.

What are the limitations of XML to Compose migration?

XML styles have no direct Compose equivalent and must become parameterized composables or modifier patterns. During incremental migration both XML and Compose themes coexist, requiring duplicate style maintenance until migration completes.