skill-compose

Implement Android presentation layers with Jetpack Compose and Material 3.

Updated Feb 3, 2026
One-click install
npx skills add https://github.com/pliniou/loto-generator --skill skill-compose-pliniou
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: skill-compose
Source: https://github.com/pliniou/loto-generator/tree/main/.windsurf/skills/skill-compose
Command: npx skills add https://github.com/pliniou/loto-generator --skill skill-compose-pliniou

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Este Skill encapsula padrões avançados para construir UIs Android modernas com Jetpack Compose, promovendo interfaces acessíveis, responsivas e alinhadas ao Material Design 3.

Core Features & Use Cases

  • Composables declarativos e tela única com Scaffold para estruturas consistentes.
  • Gerenciamento de estado com ViewModel e StateFlow/LiveData para UI previsível.
  • Navegação segura entre telas com Compose Navigation e animações suaves.
  • Themings: suporte a light/dark e temas Material 3 com paletas personalizadas.
  • Acessibilidade e internacionalização através de textos de recurso e descrições de conteúdo.

Quick Start

Crie uma tela de exemplo usando Jetpack Compose e Material 3, defina um tema e execute no Android Studio para observar o estilo e a responsividade.

Frequently Asked Questions about skill-compose

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

FAQPage Schema
How do I build Android UIs with Jetpack Compose and Material 3 theming?

Build Android UIs with Jetpack Compose by using declarative composables and configuring Material 3 theming with light and dark mode support. This approach provides consistent styling and responsive layouts across your application.

What is the best way to manage state in Jetpack Compose using ViewModel?

Manage state in Jetpack Compose by integrating ViewModel with StateFlow or LiveData. This pattern ensures predictable UI state updates and maintains a clear separation between your presentation layer and business logic.

How do I implement navigation between screens in Jetpack Compose?

Implement navigation between screens in Jetpack Compose using Compose Navigation. It enables safe type-secure routing between composable screens and supports smooth animations for transitions.

Can I use Jetpack Compose to structure consistent app layouts with Scaffold?

Yes, you can use Jetpack Compose to structure consistent app layouts by implementing Scaffold. It provides a standardized Material 3 layout structure for app bars, bottom navigation, and floating action buttons.

How does Jetpack Compose handle accessibility and internationalization?

Jetpack Compose handles accessibility and internationalization through content descriptions and resource texts. This ensures your UI components are properly labeled for screen readers and support multiple languages.

Do I need to separate UI from business logic when using Jetpack Compose?

Yes, you need to separate UI from business logic when using Jetpack Compose. The framework encourages isolating presentation logic in composables while ViewModels handle state management and business rules.