RaisedButton

3 minutes
Share the link to this page
Copied
  Completed
A Material Design raised button. A raised button consists of a rectangular piece of material that hovers over the interface.

Transcript

Hello in this video I am going to show you the rain button. The raised button is a material design type of button that will be been flat it has sort of luck and elevation elevation increasing. when the button is pressed you can add it as a child as you normally would, where it's within an array of widgets or just a child directly. totally up to you to add this really simple just do child butter. Yeah, we can do is there is no one default parameter essentially and that is the on press so you require the on press without that it will not work. So let's add the on press one.

So on press pressed, you can even put no and that means it's not going to have any sort of insurance. I've already got a method right here, that's simple button, click, sounds gonna, you know, put that button. Click. And now, let's see what we get. We got this at the moment, obviously, if I click it, say button, click, boom, you're not texting this child in here, and we have that text, we could add an image to that text, we could add a row that will allow us to add an array or widget so could add an image and then from text next to an icon. I'm going to keep it simple can add some text, and we'll say There we go.

If you want to modify the collapse, we can do that. So there's a whole heap of properties of cross chain text in the text color. Let's do the color, the background color Hello Looking good, let's change the actual text color. Text Color, I think white now complement the red a lot better. Yeah, and we can change of color, you can also change like the color brightness will drop the disabled color. So the button you know essentially gets disabled for some reason maybe the user does something or they're they don't have let's say set of permissions or they haven't done something and someone logging for, you can't click the Login button until you filled in both text boxes, for example.

And we say highlight color to black, blah. nap applicant, we get you know, black and as you can see it has that raised effect. It's got the shadow and they're all holding people over the property that you cannot even change, you know, the elevation amount, the animation duration, but these are all pretty simple stuff. So we're recommend it as an extra task. Go through all of them. properties, experiment with them.

I'll provide an extra link that will take you to the official documentation where you can actually see all the different properties available. And that should help if you need any. If you have any questions, feel free to drop me a message and we'll all look forward to seeing you in the next video.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.