Get Device Breakpoints with responsive_builder

To make our Flutter applications responsive, we can use MediaQuery and LayoutBuilder to define the pixel breakpoints for each device class—desktop, tablet, and smartphone. Another solution is to use an existing package that defines the most common breakpoints, such as responsive_builder.

The responsive_builder package provides widgets that require less code when we’re implementing responsive design in our applications.

Size information with ResponsiveBuilder

One of the widgets provided by responsive_builder is ResponsiveBuilder, which has a builder function with a parameter of type SizingInformation. A SizingInformation object contains the type of device, the size of the screen, and the local widget size, combining both MediaQuery and LayoutBuilder.