material-components / material-components/material-components-android

[Slider] Add "Wavy" style shown in Android 13/M3 docs

Open
#2,690 6 comments 7 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

feature request Widget: Slider
Dominant language
Java
Stars
17.4k
Forks
3.2k
PR merge metrics
No merged PRs in 30d

Description

**Is your feature request related to a problem? Please describe.**
I've noticed that in both the Android 13 Beta 1 build and the Material Design 3 docs, there are `Slider` components that show a wavy/squiggly line within the elapsed portion of the component. I want to add this as an option to my own app, simply for stylistic cohesion with M3.

**Describe the solution you'd like**
I want a way for the material components to provide this behavior in `Slider`, perhaps via a setter like `isWavy`? Preferably updating this value at runtime also animates the transition from wavy to not wavy, like it does in Android 13.

**Describe alternatives you've considered**
Implementing this myself, which I doubt is possible since any sort of customization you could do to `Slider` is likely limited to static drawables.

**Additional context**
Heres a screenshot of the "wavy" Slider in Android 13.
![image](https://user-images.githubusercontent.com/65370175/167062736-99d506de-11b5-49f2-8957-b52a83547dbc.png)

And here is a visual of a "wavy" slider within the Material Design 3 docs:
![image](https://user-images.githubusercontent.com/65370175/167063298-7fbe6755-a21f-4835-8edd-56edc67db771.png)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start from the Slider component entry point and review how its track is rendered and how visual properties can change at runtime. Done means Slider exposes an optional wavy elapsed-track style and animates transitions between wavy and non-wavy states as requested.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, java
Domain
design, mobile
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.