Set orientations Flutter

Question

How to enable landscape and portrait orientation to tablets and iPad, but small devices just portrait mode?

Set orientations

void main() async {
  
  await SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
  
  runApp(
    // ..
  );
  
}

Answer 1

You can set the desired orientation for your Flutter app by using the SystemChrome.setPreferredOrientations method. To enable landscape and portrait orientation for tablets and iPads, but only portrait mode for smaller devices, you can use the following code:

import 'package:flutter/services.dart';
import 'dart:io' show Platform;

// ...

void main() {
  runApp(MyApp());
  if (Platform.isTablet || Platform.isIOS) {
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.landscapeRight,
    ]);
  } else {
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
    ]);
  }
}

In this code, Platform.isTablet and Platform.isIOS are used to determine whether the device is a tablet or an iPad. If the device is a tablet or an iPad, the SystemChrome.setPreferredOrientations method is called with an array of DeviceOrientation values that allow both landscape and portrait orientations. If the device is not a tablet or an iPad, the method is called with an array of DeviceOrientation values that allow only portrait orientation.

Answer 2

Another approach is to check the width of device.

Use MediaQuery or WidgetsBinding intance (see here)

From research, you can find the widest phone dimension(lets say 480px)

and add it as a breakpoint. check manually all devices or use the breakpoints mentioned in this article for html

your condition could be as follows:

final double deviceWidth=WidgetsBinding.instance.window.physicalSize.width;
final double breakPointWidth=480;

if(deviceWidth<=breakPointWidth){
//set portait only options
}
else {
//set both.
}