Material-ui: Touchable Ripple Component

Created on 4 Aug 2015 · 7Comments · Source: mui-org/material-ui

I want to create a list like the Gmail inbox one as shown here - http://material-ui.com/#/components/lists - but I want to heavily customise it. So I was actually thinking of building such a component from scratch. What I'd like to know is, if there's a component to provide the ripple effect on click that I can use to wrap my custom component ? If not a component then a few lines of code in some form that does the magic ?

enhancement

Source

rishabhp

👍1

Most helpful comment

Couldn't this be as simple as adding optional ripple behavior to the Paper component? Then you'd theoretically be able to compose anything.

joncursi on 3 May 2016

👍7

All 7 comments

@rishabhp If you wrapped something in an enhanced button, it has sort of a ripple, but it would need to be adjusted. I don't think we have a component just for ripples, they have all been implemented on a component by component basis, so your component would be pretty useful, maybe even a mixin. If you look at the tooltip component, the ripple is calculated to be exactly the length of the component and also is placed at different starting points if you wanted.

Zadielerick on 4 Aug 2015

@rishabhp how do you want to customize it? .. I'm trying to see if you actually _need_ to implement a new a component and if you can't use any existing components to achieve what you want.

Next, the ListItem component already provides the ripple effect right? Couldn't you just modify that? If not, take a look here maybe?

shaurya947 on 24 Nov 2015

Might not be a bad idea to document the ripple component some how. it can be used in many places. Specially when others wish to create their own components from scratch. Besides we don't support all material design components yet so, this isn't bad :grin:

alitaheri on 28 Jan 2016

I agree that it would be good if we could support and document components and approaches to various animations, such as ripples.

I think my preference would be to hold off for now just because I feel like the surface area of what we're supporting right now is large enough with our existing resources :laughing:. But I agree with the sentiment.