Original subtitles

In the last section, we accomplished step number two of creating our own custom widget.

We're now going to move on to step number three, which says that we have to define a build method inside

of our class and that build method has to return.

The widgets that are custom widget is going to show on the screen.

I'm going to first get started by moving this comment into the class body itself, because the comment

itself is saying we have to add a method to the class which has created.

So then inside the class, I'm going to add a method called build like so.

The build function right here is always going to return something called a widget type, so I'm going

to annotate the return type as being widget like so.

You'll notice we have a red squiggly right here, if you read the text, it says invalid override and

then it gives you a little bit of information now that what this area is complaining about right now

is that we have to find a build method on our widget that currently takes no arguments and returns a

widget.

But if we are going to extend the stateless widget right here, then you and I are required to define

a build method.

That returns a widget, but also accepts a value type of build context.

So in other words, that error message is saying, OK, you know what, you defined a build method.

That's great.

I'm happy you did that.

You're trying to return a widget.

That's good.

I'm happy with that.

But you know what?

Your build method, it has to return or accept an argument of something called a build context.

So it wants us to receive that argument like so.

So we refer to this single argument to this bill function as context, we're not going to use context

just yet.

OK, so we're going to hold off on a definition of what this context thing is.

So for just right now, all we need to understand is that if we're going to define this failed method,

we have to accept an argument called context.

And we'll come back to this later on and talk about why we are receiving this thing.

It's going to end up being very important and very relevant to some of the later applications we work

on.

But right now, we don't need to worry about context.

It's now inside this build method, we're going to return all the widgets that are custom widget is

going to show when it appears on the screen.

And so for this step, we get to do something really easy.

We're going to go back over to our main function right here.

We're going to select all of these different widgets that we had put together.

So everything from material up down here to the bottom.

I'm going to cut all that out.

I'm going to go back over to my bill function right here, and I'm going to return.

And then paste all the stuff that we just copied.

I'll then save the file and all the formatting kicks in automatically.

OK, so now we just defined our build method, now, any time we try to show our custom app widget on

the screen, Flutter is going to automatically call this build method right here.

It's going to take all the different widgets that we return and it's going to try to show all those

widgets directly on the screen for us.

All right, and that's pretty much it, that's our three step process.

So at the top, we did our import, we created our class that extended a base class of stateless widget

that inside of our class app, we defined our build method that returned all the widgets that our app

widget is going to show on the screen.

So let's pause right here when we come back to the next section, we're going to fix up our main dirt

file and make sure that we import in that new app widget we just created and make sure that we try to

show an instance of that app widget with our run app function.

So a quick break and we'll take care of that in the next section.