Skip to content

newshqyang/compose-samples

Repository files navigation

Jetpack Compose Samples

Jetpack Compose Samples

This repository contains a set of individual Android Studio projects to help you learn about Compose in Android. Each sample demonstrates different use cases, complexity levels and APIs.

For more information, please read the documentation

💻 Requirements

To try out these sample apps, you need to use the latest Canary version of Android Studio. You can clone this repository or import the project from Android Studio following the steps here.

🧬 Samples

Project

JetNews

A sample blog post viewer that demonstrates the use of Compose with a typical Material app and real-world architecture.

• Medium complexity
• Varied UI
• Light & dark themes
• Resource loading
• UI Testing

> Browse

Jetnews sample demo

Jetchat

A sample chat app that focuses on UI state patterns and text input.

• Low complexity
• Simple Material Design theme (Light & dark)
• Resource loading
• Back button handling
• Integration with Architecture Components: Navigation, Fragments, LiveData, ViewModel
• Animation
• UI Testing

> Browse

Jetchat sample demo

Jetsurvey

A sample survey app that showcases text input, validation and UI state management in Compose.

• Low complexity
TextField and form validation
• Snackbar implementation
• Element reusability and styling
• Various form elements


> Browse

Jetsurvey sample demo

Jetsnack

Jetsnack is a sample snack ordering app built with Compose.

• Medium complexity
• Custom design system
• Custom layouts
• Animation

> Browse

Jetsnack sample demo

Jetcaster

A sample podcast app that features a full-featured, Redux-style architecture and showcases dynamic themes.

• Advanced sample
• Dynamic theming using podcast artwork
• Image fetching
WindowInsets support
• Coroutines
• Local storage with Room

> Browse

Jetcaster sample demo

Rally

A Compose implementation of the Rally Material study, a financial app that focuses on data, charts, reusability and animations.

• Low complexity
• Material theming with a dark-only theme
• Custom layouts and reusable elements
• Charts and tables
• Animations
• Screenshot tests

> Browse

Rally sample demo

Crane

A Compose implementation of the Crane Material study, a travel app that uses Material Design components and Material Theming to create a personalized, on-brand experience.

• Medium complexity
• Draggable UI elements
• Android Views inside Compose
• UI state handling
• UI Tests

> Browse

Crane sample demo

Owl

A Compose implementation of the Owl Material study. The Owl brand uses bold color, shape, and typography to express its brand attributes: energy, daring, and fun.

• Medium complexity
• Material theming & light/dark themes
• Custom layout
• Animation

> Browse

Owl sample demo

🧬 Compose in existing app samples

To see how Compose and view-based UIs can coexist and interact together, check out these samples:

License

Copyright 2020 The Android Open Source Project

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    https://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

Packages

No packages published

Languages

  • Kotlin 99.8%
  • Shell 0.2%