Jetpack Compose Codelabs

This codelab focuses on managing state and events within a declarative UI framework using Jetpack Compose. By building a 'Wellness' application, you learn how to handle state changes and UI updates.

Key concepts covered include:

• Thinking about state and events in a declarative paradigm.
• Using Compose APIs like mutableStateOf to track state changes and trigger UI recompositions.
• Integrating ViewModels into a Compose-based application to manage business logic and state lifecycle.

To ensure the source code follows the project's formatting rules, use the spotlessApply Gradle task. This will automatically format the files in the repository.

./gradlew spotlessApply

This codelab provides hands-on experience with Jetpack Compose's theming APIs. You will learn how to customize and apply consistent styling across an application by managing three core pillars:

1. Colors: Defining color schemes for different modes (e.g., Light and Dark themes).
2. Shapes: Standardizing the corner radius and shape styles for UI components.
3. Typography: Setting up consistent text styles (font family, weight, size) throughout the app.

The goal is to ensure that these styles are used consistently and that the application can seamlessly support multiple themes, such as light and dark modes.

To use this codelab, which demonstrates migrating parts of the Sunflower app to Jetpack Compose, follow these steps:

1. Install Android Studio: Ensure you have the latest Android Studio canary version installed.
2. Download and Import: Download the sample repository and import it into Android Studio.
3. Build and Run: Build the project and run it on an emulator or physical device.

Branching Strategy:

• Use the main branch as your starting point for the migration exercises.
• Use the end branch to view the completed solution.

Prerequisites:

• Proficiency with Kotlin syntax (including lambdas).
• Familiarity with Jetpack Compose basics.

This repository provides two versions of the Advanced State in Jetpack Compose Codelab via git branches:

• main: Use this branch for the starter code. This is the base you will modify to complete the codelab exercises.
• end: Use this branch to view the final solution after completing the codelab.