As promised now I’ll show how to write SimpleOverlay Widget without any helpers. I’ll omit some boilerplate code which was already describer in previous articles.

Quick Theory

There are few more things we need to know when implementing Widgets that might contain multiple children.

The first thing we need to understand is the concept of the Slots. Slot is basically just a position of the child Widget inside our Widget. It has nothing to do with the x and y pixel coordinates, but rather logical position. For example in the case of a Toolbar it can represent navigation icon, logo, title or…


In previous articles we discussed how to create leaf Widget without children and Widget with a single child. Now it is time to create more complex Widget with multiple children.

Today I will describe how to create a SimpleOverlay Widget. The only thing it does is placing one Widget and overlaying it with a different Widget while keeping the size of the first Widget. It is such a simple concept but I’m using it quite often in my projects.

Hm… Can’t we use Stack for this? In the case when size of a child is known in advance — yes…


In previous article we have created a custom Widget to notify us when its child size changes. To accomplish this task SingleChildRenderObjectWidget helper was used. It simplifies some parts of the code because we don’t need to write our own Element.

This time we will write everything from scratch. Writing Elements is not that hard but not without some tricky points. The main somewhat difficult thing to understand is how Element and RenderObject interacts with each other.


To avoid repeating myself (and to keep this article reasonable size) I will describe only changes from the previous part.

As before, first…


The time has come for my second article. This time it will be a pretty simple Widget that notifies us when its child size changes. The task is pretty simple but the main point of it is to show you how to manage children in RenderObject.

When I just started with the Flutter it was one of the questions I had and even completing course on Udemy, sadly, I didn’t receive my answer. On the StackOverflow people advise to use GlobalKey on the Widget, finding its RenderObject and fetching size for it.

While there is nothing wrong with the above…


Declarative UI in Flutter is pretty nice, easy to use and it is very enticing to use it as much as possible. But very often developers just go overboard with it — writing everything in a declarative style even when sometimes task can be done much more efficiently and easier to understand in a more imperative way.

What everyone should understand — there always must be a balance between declarative and imperative programming. Each has its own uses and each shines at some tasks brighter than other.

In this series of articles I’ll describe how to solve different problems by…

Rostyslav Lesovyi

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store