Flutter Device Orientation

Question

I wonder why Flutter does wonderfully rotate from Portrait to Landscape if run on an iOS device but does not rotate at all on my Android device ??

As a code example you find a "hello world" example below. Again, also for this simple code-example, Flutter rotates for iOS device out of the box but it does not rotate for Android. Why ??

The same ist true for more complex Apps adding ListViews or other (i.e. iOS rotates nicely the screen, Android does not).

I found something called OrientationBuilder (link1) or MediaQuery.orientation (link2). But this seems only offering the capability to distinguish the device's orientations and then you have to act in code accordingly. This seems like a possible solution but I wonder why I have to invest extra Work for Android devices but not for iOS ?

What I am looking for is an "AUTOMATIC" rotation possibility for Android under Flutter (just as iOS does it out of the box). How could I achieve this ?

Here is two screenshots of my "hello world" example. (iOS rotates out of the box / Android does not):

And here is the Dart-code:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter = _counter + 2;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

Solution 1

Thanks to the answers of Jagraj Singh and also user1462442, I finally found a way to rotate the Android Emulator.

It is not enough to just rotate the Android Emulator (for example with CMD <- key press or by the settings-menu) - No! In addition, you have to select the small icon on the Android-Emulator phone menu-bar (see red circle on image)...

Don't know why AVD is making it this way....

Solution 2

In notification panel or system settings of your phone(Android) change the device orientation to automatic. another method is using system chrome lib of flutter , you can change or set preferred orientation , may be this could help,flutter docs

Solution 3

Are you running flutter in an emulator? I believe rotate is automatic when I install it into the device. You probably need to trigger it on android emulator settings.