myofficework000 / jetpack-compose-all-in-one-guide

Learn step by step UI development using Jetpack compose [beginners to advance]

Compose Guidebook: Learn Android Jetpack Compose

Learn step by step UI development using Jetpack Compose [beginners to advance]. This comprehensive collection of lessons and features is specifically designed to guide you through the step-by-step process of understanding Jetpack Compose and Android development.

Table of Contents

• Jetpack Compose Lessons (1-22)
• Application component
  • Activities
  • Services
  • Broadcast Receivers
  • Content Providers
• Android architectures
  • MVP (Model-View-Presenter)
  • MVVM (Model-View-ViewModel)
  • Clean Architecture
  • MVI (Model-View-Intent)
• Jetpack components
  • Navigation
  • ViewModel
  • LiveData
  • Room Database
  • WorkManager
  • Paging 3
• Third Party Library
  • Stripe: Payement gateway integration
  • Chat GPT: AI api implementation
  • Grapgh QL API Integration
  • Yelp API
  • Barcode Scanner: ML kit library integration
  • MPchart: Charting library
  • Camera V2 API
  • RxJava
• Demos (Planned in August 2024 release)
  • Instagram Demo UI
  • TikTok Demo UI
  • Youtube Demo UI
  • Facebook Demo UI
  • Shopping App Demo UI
  • Banking App Demo UI
  • Whatsapp Demo UI

Lessons

Lesson	Preview
Lesson 1: Column, Row, Box, Modifiers This lesson shows various Compose layouts that position the components in a certain direction or alignment. • Column • Row • Box • Modifier
Lesson 2: Material Design - Shapes This lesson shows various examples of material design components in Compose • Chapter 1: Shape, Surface • Chapter 2: Text examples • Chapter 3: Button examples • Chapter 4: Image examples • Chapter 5: Progress Bar examples • Chapter 6: Floating action buttons
Lesson 3: Types of List This lesson shows common implementations of displaying lists, such as expandable lists and lists with animations • Chapter 1: Simple List • Chapter 2: Custom Vertical List • Chapter 3: Simple Horizontal List • Chapter 4: Vertical Grid List • Chapter 5: Horizontal Grid List • Chapter 6: Expandable List • Chapter 7: Expandable Animated List • Chapter 8: Shimmer Animated List
Lesson 4: Types of Dialog This lesson shows various examples of dialogs • Chapter 1: Alert dialog • Chapter 2: BottomSheet Dialog • Chapter 3: App Rating dialog • Chapter 4: Logout dialog
Lesson 5: Maps This lesson shows various ways to use Google Maps (Note: We aren't paying the service. Please use your own account and provide the API key in local.properties. See local.properties.defaults for the format) • Chapter 1: Map Basics - Simple Map - Inflate Marker on Map • Chapter 2: Map types • Chapter 3: Current Location on map • Chapter 4: Search on map
Lesson 6: Theme Change This lesson shows theme change from light mode to dark mode
Lesson 7: Constraint Layout This lesson shows various examples of ConstraintLayout in Compose • Chapter 1: Basics of Constraint Layout • Chapter 2: GuideLine • Chapter 3: Chain • Chapter 4: Barrier
Lesson 8: Animation This lesson covers various animations in Compose • Chapter 1: Tween Animation • Chapter 2: Animated Visibility • Chapter 3: Animated Content • Chapter 4: Animation Specs • Chapter 5: Shimmer Animation
Lesson 9: UI Testing This lesson shows how to do UI testing in Compose
Lesson 10: (W.I.P.) Theming This lesson explores custom theming in Compose • Chapter 1: Custom Colors • Chapter 2: Custom Typography • Chapter 3: Custom Shapes • Chapter 4: Custom Themes
Lesson 11: XML Interoperability This lesson shows how to show the conventional XML layout in Compose • Chapter 1: Compose View into activity xml
Lesson 12: Web Views This lesson demonstrates how to create web views in Compose
Lesson 13: (W.I.P.) Localization This lesson covers localization in Jetpack Compose • Chapter 1: Adding Language Support • Chapter 2: Formatting Dates and Numbers • Chapter 3: RTL Support • Chapter 4: String Plurals
Lesson 14: (W.I.P.) Drop down menu This lesson covers drop down menu in Compose
Lesson 15: Custom Radio button This lesson covers customizations of radio button in Compose
Lesson 16: State and Visibility This lesson covers the concept of states in Compose
Lesson 17: Flow Layouts This lesson covers Flow Rows and Flow Columns in Compose
Lesson 18: (W.I.P.) UI Testing This lesson shows how to do UI testing in Compose
Lesson 19: Caching with Okhttp Interceptors This lesson shows how to cache Retrofit responses with Okhttp Interceptors
Lesson 20: Biometric Authentication (W.I.P.) This lesson shows how to do authenticate users with Biometrics
Lesson 21: DataStore (W.I.P.) This lesson shows how to use Android DataStore
Lesson 22: Media3 ExoPlayer (W.I.P.) This lesson shows how to use ExoPlayer from Media3

Contributors

Contributions are welcome! If you have any ideas, suggestions, or improvements, please open an issue or submit a pull request.

License

This project is licensed under the MIT License.

Connect with me 👇

jetpack-compose-all-in-one-guide's Issues

Design Youtube UI Demo

Design Facebook Demo UI

Demo app with every release?

First of all, a big thumbs up to your project. Right now, the only way to feel your hard work is building with your project by our own which sometimes is really time consuming.

If you consider attaching a built apk with each release, it will really help to have the insigts of your great work fast and easily.

create an release with new demo screens

Design ecommerce app UI

Design app logo

Fixed timer crash issue

Design a Instagram Demo UI