Super Layout Builder

Check it out at Pub.Dev

The best way to create responsive layouts for dynamic screen sizes.

*Note: This library was designed for the web version of the flutter, since web pages, unlike cell phone applications, can be resized several times in a row by the user.


ezgif com-video-to-gif


ezgif com-video-to-gif (1)

Help Maintenance

I've been maintaining quite many repos these days and burning out slowly. If you could help me cheer up, buying me a cup of coffee will make my life really happy and get much energy out of it.

Buy Me A Coffee

Getting Started

The implementation is very simple, just call the widget passing your other widget as a child.

  triggerWidth: [ // Pass list of sizes to compare
  triggerHeight: [
  builder: (c, MediaQueryData m) => MyWidget(),


When passing values ​​to the list of triggers, when the screen is resized, it will be checked if the new screen size is smaller or larger than one of the list sizes, thus only redoing the screen when it hits a specific point, preventing the screen be redone for each modified px. From the return of MediaQueryData, you can for example compare if the current screen size is already feasible to use a drawer as in the example at the beginning.