BuildContext?! | Decoding Flutter

[MUSIC PLAYING] ANDREW FITZ GIBBON: So you've learned what a widget is and even started writing some of your own. Every single one of these widgets build methods takes in this build context thing. I know you need it and things like navigator, media query and various builders need it, but what is it? Remember back to what a widget is. It's a blueprint or a recipe for what that part of the UI should be. But like words in a book, they don't appear in isolation. Rather, they appear alongside other widgets. But how does a widget know where it is in relation to those other widgets? Well, it doesn't. Since the blueprint can be reused just about anywhere, the widget itself doesn't keep any information about where in the tree a specific instance is. The secret here is that there's more than just a widget tree. Let's suppose you've created a new widget, either extending from stateless or stateful. If you poke into the implementations of these, you'll see that both are themselves implementations of the class widget. Looking at the list of methods in a widget, there's not much more here than what's in most Flutter and dark classes. But one in particular stands out to me-- this "create element" thing that says something about a "concrete instance." These elements are the objects that actually keep track of where a specific widget is, and therefore, what its parent and children are. So when you build a new widget, the Flutter framework calls that widget to create element method. The element in returns maintains the information needed at runtime for this widget in this part of the app. At that point, the element is effectively a node in a tree of other elements, each with a reference to the widget they represent. And what is an element? It's just a type of build context. So the next time you see a media query dot of context, replace "context" in your head with thing that allows my widget to figure out where my widget is. In other words, it gives your widgets build method the context it needs. For more on elements, build contexts and all things Flutter, head on over to flutter.dev. [MUSIC PLAYING]

Channel: Flutter

Views: 45,368

Rating: 4.9278936 out of 5

Keywords: GDS: Yes, What’s a widget, widgets 101, widgets crash course, widgets for beginners, intro to widgets, widget lifecycles, how widgets work, what are Flutter widgets, developer shows, developer tutorials, Flutter, Flutter tutorials, Flutter developers, flutter app development, Flutter course, how Flutter works, Flutter best practices, Decoding Flutter, Google developers, flutter 101, get started with flutter, flutter apps, flutter widgets, build apps with flutter

Id: rIaaH87z1-g

Length: 2min 40sec (160 seconds)

Published: Fri May 28 2021