Mobile Development Flutter Subjective
Oct 03, 2025

How to handle device orientation in Flutter?

Detailed Explanation
Flutter device orientation handling:\n\n**Detect orientation:**\n\n@override\nWidget build(BuildContext context) {\n final orientation = MediaQuery.of(context).orientation;\n \n if (orientation == Orientation.portrait) {\n return PortraitLayout();\n } else {\n return LandscapeLayout();\n }\n}\n\n\n**OrientationBuilder:**\n\nOrientationBuilder(\n builder: (context, orientation) {\n return GridView.count(\n crossAxisCount: orientation == Orientation.portrait ? 2 : 4,\n children: widgets\n );\n }\n)\n\n\n**Lock orientation:**\n\nimport 'package:flutter/services.dart';\n\n// Lock to portrait\nSystemChrome.setPreferredOrientations([\n DeviceOrientation.portraitUp,\n DeviceOrientation.portraitDown\n]);\n\n// Allow all orientations\nSystemChrome.setPreferredOrientations([\n DeviceOrientation.portraitUp,\n DeviceOrientation.portraitDown,\n DeviceOrientation.landscapeLeft,\n DeviceOrientation.landscapeRight\n]);\n\n\n**Responsive design:**\n• Use MediaQuery for screen dimensions\n• Flexible and Expanded widgets\n• LayoutBuilder for custom layouts
Discussion (0)

No comments yet. Be the first to share your thoughts!

Share Your Thoughts
Feedback