ScreenLayout class

A widget that will layout child at the given size in breakpoints. ScreenLayoutBreakpoints.portraitStandardBreakpoint while in portrait mode, or ScreenLayoutBreakpoints.landscapeStandardBreakpoint while in landscape mode. After laying out at that size, ScreenLayout will scale the child so as to fix the current screen size, up to a maximum scale ratio of maxScale, or ScreenLayoutBreakpoints.portraitConstrainedWidth while in portrait mode, or ScreenLayoutBreakpoints.landscapeConstrainedWidth while in landscape mode.

This is useful for when you have a design where the base design is created with a given width, and all UI elements are meant to be shown exactly as the design shows relative to the current device's screen size. In other words, this widget will implement a non-responsive UI that automatically scales children up or down to match the current screen size. It is usually a bad design practice to scale up to fullscreen on devices like a tablet or PC, and you can control the maximum things will scale by using the above-mentioned settings to avoid that and show a more reasonable UI design.

example:

ScreenLayout(
  breakpoints: const ScreenLayoutBreakpoints(
    portraitStandardBreakpoint: 375.0,
    portraitConstrainedWidth: double.infinity,
    landscapeStandardBreakpoint: 375.0,
    landscapeConstrainedWidth: double.infinity,
    maxScale: 1.2,
  ),
  child: HogehogeWidget(),
),