Material_3_Expressive_List

KO | EN

gitlite — search

#javascript #typescript #android #machine-learning #rust #deep-learning #nodejs #macos #java #windows #cli #kubernetes #openai #open-source

Material_3_Expressive_List

(★ 13)

A curated collection of modern, expressive UI components built with Jetpack Compose and Material 3.

Material_3_Expressive_List Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Material 3 Expressive Components for Jetpack Compose

[![Linktree](https://img.shields.io/badge/linktree-1de9b6?style=for-the-badge&logo=linktree&logoColor=white)](https://linktr.ee/nicos_nicolaou)
[![Static Badge](https://img.shields.io/badge/Site-blue?style=for-the-badge&label=Web)](https://nicosnicolaou16.github.io/)
[![X](https://img.shields.io/badge/X-%23000000.svg?style=for-the-badge&logo=X&logoColor=white)](https://twitter.com/nicolaou_nicos)
[![LinkedIn](https://img.shields.io/badge/linkedin-%230077B5.svg?style=for-the-badge&logo=linkedin&logoColor=white)](https://linkedin.com/in/nicos-nicolaou-a16720aa)
[![Medium](https://img.shields.io/badge/Medium-12100E?style=for-the-badge&logo=medium&logoColor=white)](https://medium.com/@nicosnicolaou)
[![Mastodon](https://img.shields.io/badge/-MASTODON-%232B90D9?style=for-the-badge&logo=mastodon&logoColor=white)](https://androiddev.social/@nicolaou_nicos)
[![Bluesky](https://img.shields.io/badge/Bluesky-0285FF?style=for-the-badge&logo=Bluesky&logoColor=white)](https://bsky.app/profile/nicolaounicos.bsky.social)
[![Dev.to blog](https://img.shields.io/badge/dev.to-0A0A0A?style=for-the-badge&logo=dev.to&logoColor=white)](https://dev.to/nicosnicolaou16)
[![YouTube](https://img.shields.io/badge/YouTube-%23FF0000.svg?style=for-the-badge&logo=YouTube&logoColor=white)](https://www.youtube.com/@nicosnicolaou16)
[![Static Badge](https://img.shields.io/badge/Developer_Profile-blue?style=for-the-badge&label=Google)](https://g.dev/nicolaou_nicos)

A curated collection of modern, expressive UI components built with **Jetpack Compose** and *
*Material 3**.  
This repository serves as both **inspiration** and a **practical reference**, showcasing how to
craft dynamic, engaging Android interfaces using Compose animations and Material 3’s expressive
design system.

Each example is self-contained and demonstrates a specific interaction pattern, animation technique,
or Material 3 component.

---

## 🚀 Future Implementation

This project is actively maintained and will continue to grow. In the future, we plan to:

- Add more **Material 3 expressive components**
- Include **new animation and interaction patterns**
- Keep the repository **up-to-date** with the latest Material 3 and Jetpack Compose releases
- Expand the **sample demos** for learning and inspiration

Stay tuned for updates, and contributions are always welcome!

---

## ✨ Components

### **Expressive Buttons**

Fluid, delightful buttons that animate in response to user interaction.

### **Button Groups**

Connected single- and multi-selection button groups following Material 3’s expressive design.

### **Split Buttons**

Compound buttons featuring a primary action and a secondary dropdown menu—ideal for multi-action
workflows.

### **FAB Menus**

Floating Action Buttons that expand into contextual menus—available both standalone and integrated
with list content.

### **Floating Toolbars**

Elegant contextual toolbars that appear and disappear with smooth animations during scroll events.

### **Custom Progress Indicators**

Beautifully styled and animated linear and circular indicators, including expressive variants.

### **Sliders**

Expressive and interactive standard, range, and centered sliders for selecting values.

---

## 📸 Examples

| FAB Menu with List | Floating Toolbars with List | Progress Indicators |
|:-------------------------------------------------------:|:---------------------------------------------------------------:|:-------------------------------------------------------:|
| <img src="examples/fab_menu_with_list.gif" width="200"> | <img src="examples/floating_toolbar_with_list.gif" width="200"> | <img src="examples/progress_indicator.gif" width="200"> |
| *FAB expanding into a menu tied to scrolling content.* | *Toolbar that appears with list scrolling.* | *Expressive, animated progress indicators.* |

## 📦 Installation & Setup

To use or explore the expressive Material 3 components in this repository, follow these steps:

## **1. Clone the Repository**

```bash
git clone https://github.com/NicosNicolaou16/Material_3_Expressive_List.git
```

## 🧾 Versioning

Material 3 version: 1.5.0-alpha22 
Target SDK version: 37 
Minimum SDK version: 29 
Kotlin version: 2.4.0 
Gradle version: 9.2.1

## ⭐ Stargazers

If you enjoy this project, please give it a star!
Check out all the stargazers
here: [Stargazers on GitHub](https://github.com/NicosNicolaou16/Material_3_Expressive_List/stargazers)

## 🔗 References

- [Material Expressive](https://m3.material.io/blog/building-with-m3-expressive)
 - [Buttons Group](https://m3.material.io/components/button-groups/overview?utm_source=blog&utm_medium=referral&utm_campaign=IO25) 
 - [Split Buttons](https://m3.material.io/components/split-button/overview?utm_source=blog&utm_medium=referral&utm_campaign=IO25) 
 - [Loading Indicator](https://m3.material.io/components/loading-indicator/overview?utm_source=blog&utm_medium=referral&utm_campaign=IO25)
 - [Progress Indicator](https://developer.android.com/reference/kotlin/androidx/compose/material3/package-summary#LinearWavyProgressIndicator(androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.drawscope.Stroke,androidx.compose.ui.graphics.drawscope.Stroke,androidx.compose.ui.unit.Dp,kotlin.Float,androidx.compose.ui.unit.Dp,androidx.compose.ui.unit.Dp))
 - [Fab Menu with list and Fab Menu standalone](https://m3.material.io/components/fab-menu/overview?utm_source=blog&utm_medium=referral&utm_campaign=IO25) 
 - [Floating Toolbar with list and Floating Toolbar standalone](https://m3.material.io/components/toolbars/overview?utm_source=blog&utm_medium=referral&utm_campaign=IO25) 
 - [Sliders](https://m3.material.io/components/sliders/overview)

Material_3_Expressive_List

Material_3_Expressive_List Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Material_3_Expressive_List

Material_3_Expressive_List Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README