Guide to Start Learning Jetpack Compose

October 29, 2021

Start

Start with an Introduction to Compose, learn about it’s fundamentals then do some codelabs.

Learn about compose archirecture and navigation. If you plan to migrate existing Android app (Compose and View-based UI co-exist), read about Adopting Compose in your app.

Samples Code: https://github.com/android/compose-samples

orials on Jetpack Compose

Start building :)

❤️ Is this article helpful?

Buy me a coffee☕ or support my work to keep this space 🖖 and ad-free.
If you can't, do send some 💖 to @d_luaz or help to share this article.

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.
Pixtory App (Alpha) - easily organize photos on your phone into a blog.
暖心芽 (WIP) 🌞❤️🌱 - reminder of hope, warmth, thoughts and feelings (or just quotes).
LuaPass - offline password manager

By Desmond Lua

A dream boy who enjoys making apps, travelling and gardening. Follow me on @d_luaz.

Tags:

Related entries:

Jetpack Compose Data Entry Screen With Firestore (Sample)

Jetpack Compose ModalBottomSheetLayout Sample

Jetpack Compose LazyColumn of Clickable Icon With Text

Jetpack Compose LazyVerticalGrid Within LazyColumn

Jetpack Compose Nested Lazycolumn

Jetpack Compose Paging Group Items Under Header

Jetpack Compose Google Places Show Nearby Places

Jetpack Compose Show Confirm Dialog

Jetpack Compose Show TextField with Popup Date and Time Picker

Jetpack Compose Show Progress Bar Dialog

Jetpack Compose Load Data (Flow.collectAsState) Common Mistakes (Compose Infinite Loop)

Jetpack Compose Load Data (Initial on Show) using Flow or Coroutines

Jetpack Compose Paging With Header

Jetpack Compose Paging Sample

Jetpack Compose Check Permission (Accompanist)

Jetpack Compose Navigation

Jetpack Compose Show Snackbar

Jetpack Compose load Firestore Data with Flow

Jetpack Compose Load Image With Coil

Android Jetpack Compose BottomNavigationBar With Compose Navigation

Android Jetpack Compose BottomNavigationBar

Jetpack Compose ModalBottomSheetLayout IllegalArgumentException: The initial value must have an associated anchor

Jetpack Compose Row Flow to Next Line (Auto Multiple Rows)

Jetpack Compose HorizontalPager Page Change Callback

Jetpack Compose Bottom Border

Jetpack Compose Tag Chip

Jetpack Compose Text Gradient Background With Shodow Text

Jetpack Compose Center

Jetpack Compose Navigation Return Result

Jetpack Compose Lauch Activity and Receive Result (Place Autocomplete example)

Jetpack Compose Show Budy Dialog

Jetpack Compose TextField Click

Jetpack Compose Weight

Jetpack Compose EditText/TextField Sample

Jetpack Compose Alertdialog Increase Spacing Between Title and Content

Jetpack Compose Navigation Pass Arguments/Data

Jetpack Compose Support Pass in Composable with Modifier.align (BoxScope DSL)

Run Jetpack Compose Paging on Background/IO Thread

Jetpack Compose Show and Hide TopAppBar at Each Screen

Jetpack Compose Hide BottomNavigation When Navigate to New Screen

Jetpack Compose Missing Material Icon

Jetpack Compose: State and LiveData

Jetpack Compose Load N Images per Row (Grid of Images)

Jetpack Compose CardView

Jetpack Compose Column onClick

Jetpack Compose Get Context

Jetpack Compose Icon Tint Color

Jetpack Compose Card Click

Jetpack Compose Text Single Line Elipsis (3 dot)

Jetpack Compose Textfield Input Capitalization

Jetpack Compose Change Textfield Background Color

Jetpack Compose Image Pager/Viewer (Side Scroll One by One)

Jetpack Compose Scrollable Column

Jetpack Compose Launch Coroutines

Jetpack Compose LazyColumn Add Divider

Jetpack Compose Has No Method Getvalue or Setvalue

Jetpack Compose Set Background Color

Jetpack Compose Fill Container Height/Width With ProgressBar

Jetpack Compose Center Text Vertically

Jetpack Compose Material Color Change Alpha

Jetpack Compose: Pass ViewModel to Composable Function

This work is licensed under a
Creative Commons Attribution-NonCommercial 4.0 International License.