skills.rest
w0lzard
w0lzardCOMMUNITY
Explore all skills by this author →
GitHub

compose

Guides writing correct, performant Jetpack Compose and Compose Multiplatform UI code.

Updated Jul 1, 2026
Search Tags:#animation#kotlin#jetpack compose#compose#recomposition#android ui#compose multiplatform
One-click install
npx skills add https://github.com/w0lzard/Wolzard-s-Marketplace --skill compose-w0lzard
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: compose
Source: https://github.com/w0lzard/Wolzard-s-Marketplace/tree/main/plugins/personal-skills/skills/compose
Command: npx skills add https://github.com/w0lzard/Wolzard-s-Marketplace --skill compose-w0lzard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Writing Compose UI involves subtle pitfalls — recomposition storms, modifier ordering bugs, misused side effects, and deprecated APIs — that are hard to diagnose without deep knowledge of the Compose runtime and source code. ## Core Features & Use Cases - Topic-specific references: Covers state management, side effects, modifiers, navigation, animations, theming, accessibility, performance, focus/TV input, and production crash patterns. - Compose Multiplatform support: Guidance for Android, Desktop, iOS, and Web targets including expect/actual, resources, and platform-specific APIs. - Design-to-code workflow: Decomposes Figma frames or screenshots into composable trees with design-token mapping to MaterialTheme. - Source verification: Verifies behavior against live androidx/androidx and JetBrains compose-multiplatform-core source via MCP tools or raw GitHub. - Use Case: When a user says "my compose screen is slow" or "implement this design", the skill consults the relevant reference, flags anti-patterns, and produces minimal correct code. ## Quick Start Ask the assistant to review or build a Compose screen, for example: "Build this Figma card design in Compose and check my LazyColumn for recomposition issues."

Frequently Asked Questions about compose

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

FAQPage Schema
How do I fix slow recomposition in a Compose screen?▼

Use stable types, avoid allocations in composable bodies, and defer state reads to the latest phase with lambda modifiers like graphicsLayer or offset. The performance reference covers recomposition skipping, stability, baseline profiles, and benchmarking.

How do I convert a Figma design to Compose code?▼

Follow the five-step decomposition: identify the root layout, split into visual sections, pick layout types, extract visual properties, and map elements to Material 3 components. Map colors and typography to MaterialTheme tokens rather than hardcoded values.

Does Compose Multiplatform support iOS and Web?▼

Yes. UI code in commonMain is portable across Android, Desktop, iOS, and Web, while platform-specific APIs like LocalContext or Window require expect/actual declarations. The multiplatform and platform-specifics references cover ComposeUIViewController, UIKitView, and ComposeViewport.

Which Compose animation API should I use?▼

Use animate*AsState for single properties, AnimatedVisibility for show/hide, AnimatedContent for content swaps, updateTransition for synchronized properties, and Animatable for gesture-driven control. The animation reference includes a decision tree and phase-aware performance guidance.

What Compose APIs have been deprecated or replaced?▼

Accompanist libraries were replaced by built-in APIs: enableEdgeToEdge, HorizontalPager, PullToRefreshBox, and FlowRow. Other migrations include type-safe navigation routes, animateItem replacing animateItemPlacement, and collectAsStateWithLifecycle replacing collectAsState.

Related Skills

Explore More Software Engineering Skills→
huneyolivhuneyoliv
1

kotlin-build-kmp-gradle-governance

Review and design Gradle build structures for Kotlin Multiplatform projects.

Community
Advanced
subroh0508subroh0508
18

ui-snapshot

Detect missing Compose previews, screenshot baselines, and hard-coded design values in Kotlin UI repositories.

Community
Advanced
chmonya-incchmonya-inc
1

android-ux

Applies Material Design 3 UX principles to design and audit Android Compose screens.

Official
Intermediate
PostalocityPostalocity
1

mobile-developer

Guide iOS and Android development with Swift, Kotlin, and cross-platform frameworks.

Official
Intermediate