How Stateful Widgets Are Used Best - Flutter Widgets 101 Ep. 2

ANDREW BROGDON: Hey, everybody.

I'm Andrew from the Flutter team.

And in this video, I'm going to tell you

all about Flutter's stateful widgets--

what makes them different from stateless widgets,

how state objects work, and more.

This is actually the second in a run of videos we're doing.

So if you haven't seen the first one,

I recommend scrolling down to the video description

below, where we have a link to it.

If you have seen that first video,

you're probably pretty familiar with stateless widgets.

They're an immutable configuration, or blueprint, so

to speak, for an element, which is what's

actually placed on screen.

Now, if you're like me, you hear that and you think,

immutable configs are great, but I'm not

writing an app that's just going to draw itself and stop.

What about data that changes?

How do I track that and update my UI?

Well, that's where stateful widget comes in.

It provides immutable configuration info

and a state object that can change over time and trigger

rebuilds of the UI.

Let's take a look at some code, and I'll show you how it works.

Here's a basic stateless widget.

It takes a name and count in its constructor,

and it builds a text widget to display them.

Super simple.

But let's say I need that count to change over time.

I can't change anything inside a stateless widget, right?

Count is final.

So I'll turn this into a stateful widget.

Now I've got a couple classes, a widget and a state object.

The widget is responsible for two things--

holding onto that immutable name value, which won't change,

and creating the state object.

The state object, for its part, holds

the count value, which you'll notice