Flutter in Context

An in-depth look at the BuildContext class

Part of the Decode Flutter Series

Do you know what that context object is? You know what object I mean, the BuildContext object named, context, that’s passed to the build() function all the time. It’s a necessary parameter to a bunch of static functions as well:

build(BuildContext context)
Theme.of(context)
Scaffold.of(context)
MediaQuery.of(context)
Navigator.of(context)

It helps you go up and or through the ‘render tree’ (or widget tree). In this article, we’ll take a closer look at it. That means, we’re going to look ‘under the hood’ of the Flutter framework and get down to what exactly makes up this BuildContext object named context. That means we’re walking through the code. In fact, let’s not keep you in suspense, I’ll tell you right now what this object is.

It’s an element.

I Like Screenshots. Tap Caption For Gists.

As always, I prefer using screenshots in my articles over gists to show concepts rather than just show code. I find them easier to work with frankly. However, you can click or tap on their captions to see the code in a gist or in Github. Tap or click on the screenshots themselves to zoom in on them.

Let’s begin.