Giters

FilledStacks / responsive_builder

A set of widgets to make responsive UI building in flutter more readable

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to responsive to the screen width (not shortest width)

htqbuu opened this issue · comments

commented

Hello,

As Web CSS Media Query, we commonly make web responsive base on the current screen width regardless of orientation. So that we can render different layout for tablet portrait and tablet landscape. How to achieve this requirement with this package. Could you please advise.

Thanks

commented

Hey, you can use the [OrientationLayoutBuilder](https://github.com/FilledStacks/responsive_builder#orientation-layout-builder) to achieve that.

The way I built this is to make it granular enough to where you can have a different view for each of the following:

  • mobile x landscape
  • mobile x portrait
  • tablet x landscape
  • tablet x portrait
  • desktop x landscape
  • desktop x portrait

Simply by using the

[ScreenTypeLayout.builder](https://github.com/FilledStacks/responsive_builder#screen-type-layout) in combination with the OrientationLayoutBuilder mentioned above.