skills.rest
youfengknight
youfengknightCOMMUNITY
Explore all skills by this author →
GitHub

compose-migration

Migrate Android View-based screens to Jetpack Compose with StateFlow and LazyColumn.

2|Updated May 12, 2026
Search Tags:#android#kotlin#jetpack compose#stateflow#ui refactor#view migration#recyclerview to compose
One-click install
npx skills add https://github.com/youfengknight/Android-Code-Skills --skill compose-migration
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: compose-migration
Source: https://github.com/youfengknight/Android-Code-Skills/tree/main/compose-migration
Command: npx skills add https://github.com/youfengknight/Android-Code-Skills --skill compose-migration

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you convert an Android UI built with the classic View system (XML layouts, RecyclerView, Adapter, and typical UI components) into Jetpack Compose, reducing manual refactor effort and keeping behavior consistent.

Core Features & Use Cases

  • End-to-end Compose migration workflow: From planning and dependency checks to rewriting screens and validating the result.
  • Practical code templates for key UI parts: Screen creation with @Composable, replacing setContentView via setContent, and migrating list UIs from RecyclerView to LazyColumn.
  • Common UI migration mappings: Menu (onCreateOptionsMenu → DropdownMenu), dialogs (AlertDialog.Builder → AlertDialog), and search (SearchView → OutlinedTextField), plus StateFlow-based state management.
  • Migration validation checklist: Verifies Compose usage patterns (e.g., @Composable, collectAsState, LazyColumn) and compile success using ./gradlew compileDebugKotlin.
  • Use Case: You’re asked to “rewrite the XX screen with Compose,” and you need a repeatable checklist and ready-to-adapt implementation snippets for the Activity, ViewModel, list rendering, and interaction UI elements.

Quick Start

Ask the Compose-migration skill to provide a step-by-step refactor plan and code template to migrate your specific View screen into a Jetpack Compose XxxScreen with StateFlow, LazyColumn, and migrated menu/dialog/search.

Frequently Asked Questions about compose-migration

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

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

To migrate an Android XML layout to Jetpack Compose, replace `setContentView` with `setContent` and convert XML elements into `@Composable` functions using Scaffold and TopAppBar. This Skill provides an end-to-end workflow and code templates to refactor View-based screens into reactive Compose UI.

How do I convert a RecyclerView adapter to a LazyColumn in Compose?▼

Converting a RecyclerView adapter to a LazyColumn in Compose involves replacing the Adapter class with a `LazyColumn` composable and mapping ViewHolders to composable items. This Skill provides practical templates to migrate list UIs and wire StateFlow with `collectAsState` for reactive data.

What is the best way to migrate imperative dialogs and menus to Compose?▼

Migrating imperative dialogs and menus to Compose involves mapping `AlertDialog.Builder` to `AlertDialog` and `onCreateOptionsMenu` to `DropdownMenu`. This Skill provides standard UI component mappings to replace imperative View patterns with declarative Compose functions.

How do I wire StateFlow into a Compose screen after migrating from Views?▼

Wiring StateFlow into a Compose screen requires using `collectAsState` to observe reactive state within your `@Composable` functions. This Skill enables you to replace imperative UI patterns with StateFlow-based state management during your View migration.

Can I migrate a SearchView to OutlinedTextField when moving to Jetpack Compose?▼

Yes, you can migrate a SearchView to OutlinedTextField when moving to Jetpack Compose. This Skill handles search flow migrations by replacing `SearchView` with `OutlinedTextField` to maintain consistent behavior in the new Compose UI.

How do I verify a successful Jetpack Compose migration?▼

To verify a successful Jetpack Compose migration, check for proper `@Composable` usage, `collectAsState` wiring, and `LazyColumn` implementation, then run `./gradlew compileDebugKotlin`. This Skill includes a post-migration validation checklist to ensure compile success.

Related Skills

Explore More Software Engineering Skills→
DrjackyDrjacky
104

android-kotlin-compose

Scaffold modular Android Kotlin projects with Jetpack Compose and MVVM.

Community
Advanced
semicolon-devteamsemicolon-devteam

test-patterns

Run Gradle unit, integration, and check tests for Spring Boot Kotlin projects.

Official
Advanced
skeletorfletskeletorflet
7

android-compose

Build Android UIs with Jetpack Compose, ViewModel, StateFlow, and Material 3.

Community
Intermediate
duylinhdang1998duylinhdang1998

jetpack-compose

Build declarative Android UIs with Jetpack Compose and Material3.

Community
Intermediate