5 minutes
Share the link to this page
You need to have access to the item to view this lesson.
One-time Fee
List Price:  $139.99
You save:  $40
List Price:  €128.51
You save:  €36.71
List Price:  £110.53
You save:  £31.58
List Price:  CA$190.63
You save:  CA$54.47
List Price:  A$208.90
You save:  A$59.69
List Price:  S$188.42
You save:  S$53.84
List Price:  HK$1,092.29
You save:  HK$312.10
CHF 91.18
List Price:  CHF 127.65
You save:  CHF 36.47
NOK kr1,073.95
List Price:  NOK kr1,503.58
You save:  NOK kr429.62
DKK kr686.39
List Price:  DKK kr960.97
You save:  DKK kr274.58
List Price:  NZ$228.20
You save:  NZ$65.20
List Price:  د.إ514.18
You save:  د.إ146.92
List Price:  ৳16,307.21
You save:  ৳4,659.53
List Price:  ₹11,661.24
You save:  ₹3,332.02
List Price:  RM656.20
You save:  RM187.50
List Price:  ₦205,785.30
You save:  ₦58,800
List Price:  ₨38,789.74
You save:  ₨11,083.57
List Price:  ฿5,038.70
You save:  ฿1,439.73
List Price:  ₺4,513.75
You save:  ₺1,289.73
List Price:  B$714.59
You save:  B$204.18
List Price:  R2,565.91
You save:  R733.17
List Price:  Лв251.83
You save:  Лв71.95
List Price:  ₩189,601.05
You save:  ₩54,175.60
List Price:  ₪516.98
You save:  ₪147.71
List Price:  ₱8,098.42
You save:  ₱2,313.99
List Price:  ¥21,792.94
You save:  ¥6,227
List Price:  MX$2,325.03
You save:  MX$664.34
List Price:  QR507.87
You save:  QR145.11
List Price:  P1,886.91
You save:  P539.15
List Price:  KSh18,172.80
You save:  KSh5,192.60
List Price:  E£6,553.98
You save:  E£1,872.69
List Price:  ብር7,998.81
You save:  ብር2,285.53
List Price:  Kz118,851.51
You save:  Kz33,960
List Price:  CLP$125,220.73
You save:  CLP$35,779.90
List Price:  CN¥1,011.17
You save:  CN¥288.92
List Price:  RD$8,157.46
You save:  RD$2,330.87
List Price:  DA18,848.39
You save:  DA5,385.64
List Price:  FJ$311.92
You save:  FJ$89.12
List Price:  Q1,081.96
You save:  Q309.15
List Price:  GY$29,135.07
You save:  GY$8,324.90
ISK kr13,781.37
List Price:  ISK kr19,294.47
You save:  ISK kr5,513.10
List Price:  DH1,386.51
You save:  DH396.17
List Price:  L2,464.07
You save:  L704.07
List Price:  ден7,916.55
You save:  ден2,262.03
List Price:  MOP$1,119.16
You save:  MOP$319.78
List Price:  N$2,547.77
You save:  N$727.98
List Price:  C$5,126.52
You save:  C$1,464.82
List Price:  रु18,565.58
You save:  रु5,304.83
List Price:  S/520.05
You save:  S/148.59
List Price:  K540.79
You save:  K154.52
List Price:  SAR524.96
You save:  SAR150
List Price:  ZK3,554.51
You save:  ZK1,015.64
List Price:  L640.62
You save:  L183.04
List Price:  Kč3,180.29
You save:  Kč908.72
List Price:  Ft49,813.32
You save:  Ft14,233.39
SEK kr1,071.59
List Price:  SEK kr1,500.27
You save:  SEK kr428.67
List Price:  ARS$123,415.66
You save:  ARS$35,264.13
List Price:  Bs962.21
You save:  Bs274.93
List Price:  COP$532,965.46
You save:  COP$152,286.72
List Price:  ₡71,270.84
You save:  ₡20,364.55
List Price:  L3,448
You save:  L985.21
List Price:  ₲1,043,416.42
You save:  ₲298,140.27
List Price:  $U5,431.06
You save:  $U1,551.84
List Price:  zł548.49
You save:  zł156.72
Already have an account? Log In


Hello, in this video, I am going to show you the scaffold layers. So the scaffold layers is essentially what's on our application by default, this blue bar on top the text on the button right here. So all of it is right here, as we remember, we have free classes in this journey, setting everything up, like the name, the color, that sort of stuff. This is a stateful widget. And this is the home page. And this is what you know, the homepage looks like this is where we'll do you know most of the logic code.

Now what we're displaying, etc. and the actual body of it goes in here. And we've been doing a separate video. So feel free to take a look at the widget videos, gesture videos, all that stuff. And all of that a lot of time will be inside here. But why don't I want to explain all the little aspects, right?

Yeah. So we've got this now title. What happened if we was to move it? I think see that title disappears. So this app bar soap new the app bar is the bar top. If you don't want that, that's what you do, you literally remove it.

And that color is set from the primary swatch right here and I covered that in one of the earliest videos in this series, feel free to take a look at that is the app base code video. Okay, so widget title, this is Garin it from. So he's getting it from here, and ultimately is getting it from this. So if we don't want that, so maybe you know, if we click a button, it will change the widget title we can change that for we call this Hello. So it says you know something different. The body again is where the main know all your elements will go.

We've covered all of that. Then we got the full floating action button. So this is just this button right here and I'm pressed it just Does underscore increment counter which is this method right here takes no parameters has nothing been set in. And basically setting the state of a particular initially was have this little label here that was getting incremented every single time whatever you do in here is totally up to you. So we got this floating action button if you do not want that, we can remove that like further comment. We no longer have a button.

So the creep back in, we can obviously change the tool tip, we can change the child law so they use an icon. And we could put you can see we've got quite a few different icons, and they'll preview here as well. So maybe if you want to make some sort of app at the I think was the app before anyone saw that before Anyway, let's do something a little different. There, too. airplay, so yeah, maybe simulating, like casting some sort of media object over there, you now have an airplane button or like a button that looks like an airplane with the functionality that you do is totally up to you. But that's really it for the scaffold.

There's not much more to it than that. So we have the app bar, which is, you know, this little top right here, you press Control space, you can see all of the different properties. So you can override some of the properties like background color, I recommend you do that recommend you change brightness. Now just experiment with this. And we have the body and we can have a floating action button as well, which is what we have right there. You can also change the position by doing what you're doing in floating action button location, and we can just say floating action, button location.

Dot. And we could say center dot for example. So that add exceeds incentive for some reason my device is rotated in the center. So if you wanted to know center dot and what else is there, the center float as well, center float it like a bit of a gap. I prefer gap Personally, I think it looks a bit more elegant. And also the different ones, we'll leave it as default which is on the right, and starting on the left and is on the right and center is obviously in the middle.

Last thing I want to show you is actually the bottom navigation bar from the bottom navigation bar. This is bottom up bar. And in here, what we can do is we said that obviously we get nothing because we haven't added anything. So if we added a child so we add a child and we say container. And all I'm going to do in here is point property to the 50.0. This should be a nice value.

As you can see we have a bottom upon it, you can override different properties, such as the decoration, you can modify the color, that way you can add a child there, it could be some sort of button, because obviously, is a navigation bar, you could have almost like tabs is totally up to you. That's really it for a scaffold. That's all there is. And there's some great comments that are built in that can help explain it further. What I'll do appoint an extra link with this video so you can actually see all of the information from the official documentation for scaffolds. If you have any questions though, feel free to pop me a message.

And as usual, I look forward to seeing you in the next video.

Sign Up


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.