Material-components-web: Investigate making Circular Progress Indicator Component
Spec reference: https://www.google.com/design/spec/components/progress-activity.html#progress-activity-types-of-indicators
Copied from https://github.com/google/material-design-lite/issues/4488
traviskaufman
All 17 comments
Any progress regarding this? It's been 10 months already, what's stopping the team from realizing this feature?
@sgomes maybe?
TonySpegel
on 22 Oct 2017
Sorry, @TonySpegel, I no longer work on this project. The team has a Pivotal Tracker set up if you want to take a look at what they're working on, and when the feature you're interested in is coming up.
sgomes
on 2 Nov 2017
@sgomes that's helpful I'll check that out :)
TonySpegel
on 2 Nov 2017
https://docs.google.com/document/d/1o5lhOBykuZAgQC9mYGiouwpLFhY8I2TLBilSAplZOJ4/edit?usp=sharing
I started to develop the circular progress with single color. I use a SVG Tag in the HTML Markup. I don't know, if this is allowed or is it only allowed to use div Tags?
MarioPeters
on 27 Dec 2017
Is there an update on this component?
Will MarioPeters proposal be reviewed?
The Pivotal Tracker ticket does not seem to mention the investigation process.
danieldeppe
on 7 Feb 2018
Some news about the @MarioPeters proposal?
AndryHTC
on 3 Apr 2018
The SVG version looks so smooth.
ojvribeiro
on 13 Apr 2018
If you're using React, here is an implementation that plays with MDC web. https://jamesmfriedman.github.io/rmwc/circular-progress
jamesmfriedman
on 20 Sep 2018
Still not available as component next to linear progress?
jvalst
on 7 Nov 2018
Any progress on this at all?
jimblackler
on 13 Dec 2018
Any progress?
aluminick
on 14 May 2019
Still nothing? It's been years!
makuc
on 25 Jun 2019
@makuc I wouldn't count on any progress here. I am also not sure who this project is intended for and what purpose it fulfills. For the Web, there are already some Solutions such as Angular Material, or just WordPress Themes. Why would anyone use this? It's lacking Components, is missing Framework Integrations etc etc
TonySpegel
on 25 Jun 2019
@TonySpegel I guess. But I like how these components leave a nice structure in the DOM, instead of populating pretty much everything with various crap (spamming _span_, for instance) all over the place when using components...
I also really liked the top-app-bar from here, which can't be found so nicely in Angular Material, and the Menu Surface, which gives more freedom (though I guess I can force AM's mat-menu through nefarious means to behave in a similar way). I guess there are pros and cons for both...
These components give slightly more freedom with theming (unless I'm missing something) unlike Angular Material overall, and seeing how v1.0 of them was released on March 2019, I guess I just hoped they'd be slowly combined or something... Since these are supposed to be the building blocks, while Angular Material the final product.
makuc
on 25 Jun 2019
any news?
condinoaljoseph
on 9 Oct 2020
This is already available. Feel free to check out https://www.npmjs.com/package/@material/circular-progress or the webcomponent version (our downstream repo) here
allan-chen
on 9 Oct 2020
@allan-chen Thanks how about react component for this?
devwhatoplay
on 9 Oct 2020
Related issues
m-alzam
路
3Comments
yapryntsev
路
3Comments
kimurakenshi
路
3Comments
patrickrodee
路
3Comments
CyborgSemon
路
3Comments
Most helpful comment
https://docs.google.com/document/d/1o5lhOBykuZAgQC9mYGiouwpLFhY8I2TLBilSAplZOJ4/edit?usp=sharing
I started to develop the circular progress with single color. I use a SVG Tag in the HTML Markup. I don't know, if this is allowed or is it only allowed to use div Tags?