📝 A curated list of awesome JetpackCompose libraries, projects, articles and resources.

See also: Android Developer Reference

Contents

• News/Updates
• Official documentation
• Articles
  • Getting started
  • Styling
  • Navigation
  • Animations
  • Interop
  • Migration
• Tools
• Libraries
• App Projects
• Compose Desktop Projects
• Videos
• Extras

🔥 News/Updates

• 24 May 2023 - Compose 1.5.0-beta01)
• 07 Dec 2022 - Compose for Wear OS 1.1 is now stable: check out new features!
• 11 May 2022 - Announcing Compose for Wear OS Beta!
• 15 January 2022 - ConstraintLayout for Compose 1.0.0 Released
• 4 August, 2021 - Compose Multiplatform in Alpha
• 28 July, 2021 - Jetpack Compose 1.0 Released!

Docs

• Jetpack Compose
• Jetpack Compose Codelabs
• Jetpack Compose Roadmap
• Jetpack Compose Release Notes
• ComposeCookBook
• Compose Academy - Jetpack Compose Reference
• Jetpack Compose App - Comparison of existing UI widgets and Jetpack Compose
• API Guidelines for Jetpack Compose
• Book: Jetpack Compose internals
• Jetpack Compose Collection
• Android Basics with Compose Course
• Compose performance Doc
• Jetpack Compose Component List – List of all components you can use in Jetpack Compose

Tools

• recompose - A tool for converting Android layouts in XML to Kotlin code using Jetpack Compose.
• Jetpack Compose Playground
• Shot - Jetpack Compose screenshot testing tool
• Radiography - UI structure printer
• Showkase - Helps you organize, discover, search and visualize Jetpack Compose UI elements
• Jetpack Compose Twitter Bot - A Twitter Bot to get all updates about Jetpack Compose in your feed

Articles

• Diving into Jetpack Compose
• Android Jetpack Compose Review
• Understanding Jetpack Compose — part 1 of 2
• Under the hood of Jetpack Compose — part 2 of 2
• Code Simple Android Jetpack Compose Drawing App
• Android Jetpack Compose: Remember Made Easy
• Jetpack Compose Effect Handlers
• Introduction to the Compose Snapshot system
• The Story of My First A-ha Moment With Jetpack Compose
• remember { mutableStateOf() } – A cheat sheet
• Inside Jetpack Compose
• What is “donut-hole skipping” in Jetpack Compose?
• Supporting different screen sizes on Android with Jetpack Compose
• Cartographing Jetpack Compose: compiler and runtime
• Focus in Jetpack Compose
• Browsing Jetpack Compose samples
• Jetpack compose — Dependency injection with Dagger/HILT
• Jetpack Compose: MVVM State management in a simple way
• Comparing Jetpack Compose performance with XML
• 🆕 🚀 Drawing edge to edge in Jetpack Compose
• 🆕 Problem solving in Compose Text
• 🆕 🚀 Every single type of Dialog in Jetpack Compose and how to use them

Getting started

• Jetpack Compose Tutorial for Android: Getting Started
• Migration to compose
• Helping You Understand The Syntax of Jetpack Compose
• Scoped recomposition in Jetpack Compose — what happens when state changes?
• Things you need to know before switching to Jetpack Compose
• Roadmap for Jetpack Compose
• 7 things you should know before using Jetpack Compose

Modifiers

• List of Compose modifiers
• Always provide a Modifier parameter
• Lessons learned when migrating my app to Jetpack Compose

Styling

• Building a Design System implementation using Jetpack Compose — Part1 (Theme)
• Building a Design System implementation using Jetpack Compose — Part2 (Component)
• How to create realistic UI with Jetpack Compose(Part II)
• Jetpack Compose: Styles and Themes (Part II)
• Create a truly custom theme in Jetpack Compose
• How to create a truly custom theme in Jetpack Compose
• Jetpack Compose: Theme and Typography

Navigation

Libraries

• Modo - Navigation library based on UDF principles
• compose-navigation-reimagined - A small and simple, yet fully fledged and customizable navigation library for Jetpack Compose
• compose-destinations - Annotation processing library for type-safe Jetpack Compose navigation with no boilerplate.
• Appyx - Model-driven navigation for Jetpack Compose
• [compose-router]() - Routing functionality for Jetpack Compose with back stack voyager - A pragmatic navigation library for Jetpack Compose
• compose-backstack - Simple composable for rendering transitions between backstacks.

Articles

• Android Jetpack Compose: Navigation
• Jetpack Compose: Navigation
• Passing multi typed data between screens with Jetpack Compose navigation component
• Passing string typed data with Jetpack Compose navigation component
• Jetpack Compose: Navigating to a Detail View (Part III)
• Handling back presses in Jetpack Compose
• Nested Navigation Graphs in Jetpack Compose
• Passing Parcelable / Serializable and Other Data in Jetpack Compose Navigation

UI Components

• Implement Bottom Bar Navigation in Jetpack Compose
• How to Use Render Effects in Jetpack Compose for Stunning Visuals
• Gestures in Jetpack compose — All you need to know

Lists/RecyclerView

• Jetpack Compose: An easy way to RecyclerView (Part I)
• Learn with code: Jetpack Compose — Lists and Pagination (Part 1)
• Expandable lists in Jetpack Compose
• StaggeredVerticalGrid of Android Jetpack Compose
• RecyclerView and LazyColumnFor in Jetpack Compose
• List animations in Compose: Add an item
• List animations in Compose: Swipe to delete
• List animations in Compose: Drag to reorder
• Jetpack Compose: Building Grids
• How to master Swipeable and NestedScroll modifiers in Jetpack Compose
• Basic Drag-n-Drop in Jetpack Compose
• Infinite LazyColumn in Jetpack Compose

Animations/Transitions

• Intro to animations with Jetpack Compose
• Jetpack Compose Animations Tutorial: Getting Started
• Building an exploding FAB transition with Jetpack Compose
• How to animate BottomSheet content using Jetpack Compose
• Creating a rotating card in Jetpack Compose
• Animate with Jetpack Compose: Animate as State and Animation Specs
• Android Jetpack Compose: Animation Spec Made Easy
• Jetpack Compose — Reveal effect
• Animations in Jetpack Compose with examples
• Intro showcase view in Jetpack Compose — Android
• 🆕 Illuminating Interactions: Visual State in Jetpack Compose
• 🆕 Creating Pager Animations in Jetpack Compose

Interop

• Jetpack Compose Interop Part 1
• Jetpack Compose Interop Part 2
• Jetpack Compose View & Android View Comparison
• Adopting Jetpack Compose with Interop API

Migration

• Getting our apps ready for Jetpack Compose
• Jetpack Compose migration course

Architecture

• Jetpack Compose navigation architecture with ViewModels
• ViewModels using Compose: MutableStateFlows or MutableStates?
• Better handling states between ViewModel and Composable
• Dagger 2 and Jetpack Compose Integration

Dependency Injection

• Koin for Compose proposal (Jetpack and Multiplatform)

Side-Effects

• Jetpack Compose Side-Effects — LaunchedEffect
• Jetpack Compose Side-Effects II — rememberCoroutineScope
• Jetpack Compose Side-Effects III— rememberUpdatedState

Custom Composables

• Custom Weekly Schedule Layout with Jetpack Compose - Part 1
• Custom Weekly Schedule Layout with Jetpack Compose - Part 2

Canvas

• Using shapes in Jetpack Compose
• Drawing and painting in Jetpack Compose #1
• Emoji Slider in Jetpack Compose using Canvas API

Exploring JetPack Compose

• Getting our apps ready for JetPack Compose
• Modifiers
• Container
• Text
• Button
• Switch
• Stack
• Border
• Row & Column
• Column
• Padding modifier
• Arrangement
• Radio Group
• Radio Button
• Card
• Snackbar
• @Preview annotation
• Android View
• Floating Action Button
• Modal Drawer Layout
• TopAppBar
• FlowLayout

Additional

• Supporting different screen sizes on Android with Jetpack Compose
• Measuring Render Performance with Jetpack Compose
• Understanding re-composition in Jetpack Compose with a case study
• Jetpack Compose: Preview
• Improving performance with Compose Compiler Metrics

Cross-platform

• Fully cross-platform Kotlin applications (almost)

Testings

• KakaoCup/Compose
• Testing your Compose layout
• How to test Jetpack Compose UI

Libraries

• accompanist - A collection of extension libraries for Jetpack Compose
• Landscapist - image loading using Glide, Coil, Fresco
• compose-icons - Open Source icon packs for Jetpack Compose including Font Awesome, Simple Icons, Feather and more.
• compose-backstack - Simple composable for rendering transitions between backstacks.
• lyricist - The missing I18N/L10N (internationalization/localization) library for Jetpack Compose!
• compose-markdown - Markdown Text for Android Jetpack Compose
• snapper - A snapping fling behavior for Jetpack Compose
• 🆕 compose-recyclerview - A library that allows seamless integration of composables in RecyclerView, addressing performance concerns and LazyList issues. Enjoy improved rendering performance, built-in drag-and-drop support, flexible configuration, and easy handling of multiple item types for dynamic UIs.
• Reorderable - Reorder items in Lists and Grids with drag and drop
• AutoLinkText - Make links, emails, and phone numbers clickable in text

UI

• neumorphic-compose - Neumorphism UI with Jetpack Compose. Just add simple neumorphic() modifier.
• compose-richtext - A collection of Compose libraries for advanced text formatting.
• compose-ratingbar - Ratingbar for Jetpack Compose.
• tehras/charts - simple Android compose charts.
• info-bar-compose - Display Snackbar-style messages, the easy way.
• shimmer - Shimmer effect
• compose-sliders - Custom Sliders (previously known as SeekBar) for jetpack compose
• Dark-Toggle-Button-Sample-Jetpack-Compose (+50 ⭐) - Animated dark mode toggle button with Jetpack Compose.
• Collection of UIs and Animations built with Jetpack Compose for Android - Collection of UIs and Animations built with Jetpack Compose for Android
• Konfetti - Easily celebrate little and big moments in your app with this lightweight confetti particle system 🎊
• heart-switch - ❤️ A heart-shaped toggle switch component for Jetpack Compose
• ProgressButton - SSJetPackComposeProgressButton is an elegant button with a different loading animations which makes your app attractive.
• SwipeAbleViews - SSJetpackComposeSwipeableView is a small library which provides support for the swipeable views. You can use this in your lazyColumns or can add a simple view which contains swipe to edit/delete functionality.
• Dropdown - A Powerful and customizable Jetpack Compose dropdown menu with cascade and animations
• FloatingActionButton SpeedDial
• ComposeCalendar - A Jetpack Compose library for handling calendar component rendering.
• WheelPickerCompose - Wheel Date & Time Picker for Jetpack Compose.
• Exploding Composable - A Jetpack Compose utility library to add explosive dust effect animation to any composable
• ComposeDynamicTheme - Material design based Theme Management System for Jetpack Compose
• 🆕 minabox - Lazy box library for Jetpack Compose, which allows to display lazy loaded items on the 2D plane.
• 🆕telephoto - Building blocks for designing media experiences in Compose UI
• 🆕Compose-Rich-Editor - A Rich text editor library for both Jetpack Compose and Compose Multiplatform,
• 🆕Animated Navigation Bar - A navigation bar with a number of preset animations
• 🆕Blueprint - 📐 library that draws a blueprint on top of your Jetpack Compose composables. It visualizes dimensions, like paddings and sizes.
• WYSIWYG Rich Editor Compose - Android WYSIWYG Rich editor for Jetpack compose.
• Animated BottomBar Compose - A Jetpack Compose library that simplifies the creation of stylish Bottom Navigation Bars with customizable animations. It allows you to easily integrate attractive navigation bars into your Android app, enhancing the user experience.
• YouTubePlayer - YouTube kotlin multiplatform player. The YouTubePlayer composable allows you to embed a YouTube video player in your Jetpack Compose app.

App Projects

• Jetpack Compose Samples (+15.9K ⭐) - Official repository with samples by Google
• sunflower (+16.8K ⭐) - Sample app by Google
• Learn-Jetpack-Compose-By-Example (+2.9K ⭐)
• Jetpack Compose Playground (+2.8K ⭐)
• ComposeAcademy-Playground (+870 ⭐)
• JetInstagram (+689 ⭐) - Instagram clone app built with Jetpack Compose
• JetpackComposeCalculator (+272 ⭐)
• flux (+335 ⭐) - A fake weather app
• JetQuotes (+363 ⭐) - A Quotes Application
• android-2048-compose (+255 ⭐) - 2048 implemented using Jetpack Compose
• DinoCompose (+198 ⭐) - Chrome's Dino T-Rex game developed in Jetpack Compose
• JetExample (+192 ⭐) - Jetpack Compose UI components examples
• Wiggles (+256 ⭐) - Beautiful Puppy adoption app with Jetpack Compose
• Facebook-Timeline-Compose-Android (+119 ⭐)
• compose-schedule-calendar (+142 ⭐) - Demo app for a horizontal schedule(event) calendar
• jetpuppy (+55 ⭐) - Jetpuppy is a puppy adoption app using Jetpack Compose UI.
• Cheddar (+70 ⭐) - Hacker News reader
• jetpack-compose-samples (+18 ⭐) - Repository with collection of many compose samples.
• jettimer (+26 ⭐) - Timer app clone built with Jetpack Compose and Hilt
• Rebound (+7 ⭐) - Highly customizable and feature rich workout log app.
• Intro Showcase View (+15 ⭐) - An android library to highlight different features of the app built using Jetpack Compose.
• Jetpack-compose-animations-examples (+4 ⭐) - Cool animations implemented with Jetpack Compose.
• ComposeCookbook (+139 ⭐) - A Collection of major Jetpack compose UI components which are commonly used.
• CoinWatch (29 ⭐) - Delightful cryptocurrency app providing real-time coin prices, price histories, and market data

Android TV

• 🆕 ComposeTv - Android TV built using Jetpack Compose TV APIs

Multiplatform

• 🆕 Compose Multiplatform - official website
• Jetpack Compose Multiplatform Android & iOS - article about migrating to Jetpack Compose Multiplatform

Compose Desktop Projects

• Compose JB - Jetpack Compose for Desktop and Web
• ComposeSlackDesktop - A Slack demo app for desktop using Jetpack Compose

Other projects

• ComposeClock

📺 Videos

• Leland Richardson's channel about Compose
• Compose by example
• Thinking in Compose
• Compose for existing apps
• What's new in Compose Design Tools

Extras

• Jetpack-Compose-Playground - Community-driven collection of Jetpack Compose example code and tutorials 🚀
• Compose Modifiers Playground

Find this repository useful? ❤️

Support it by joining stargazers for this repository. ⭐