How to show different layout for landscape and portrait in flutter

user_1344049 0
Viewed 729

Just wanted to know how we can show different layout for landscape and portrait in flutter. In Native for android we just create layout and layout-land folder and put xml files there and system will automatically detect the appropriate layout for orientation. Any help on flutter would be appreciated. Thanks

flutter-layout dart flutter android ios
2 Answers

Use official widget like docs says https://flutter.dev/docs/cookbook/design/orientation

OrientationBuilder(
  builder: (context, orientation) {
    return GridView.count(
      // Create a grid with 2 columns in portrait mode,
      // or 3 columns in landscape mode.
      crossAxisCount: orientation == Orientation.portrait ? 2 : 3,
    );
  },
);
user_55574790

Use orientation builder and check inside if the orientation is portrait or landscape. Check the documentation here.

Sample Code:

OrientationBuilder(
  builder: (context, orientation) {
    return GridView.count(
      // Create a grid with 2 columns in portrait mode,
      // or 3 columns in landscape mode.
      crossAxisCount: orientation == Orientation.portrait ? 2 : 3,
    );
  },
);
user_151886480
Related