如何在flutter中显示横向和纵向的不同布局

Question

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

Answer 1

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,
    );
  },
);

Answer 2

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,
    );
  },
);