Flutter Debugging issue when changing Orientation in emulator-CodePudding

I make responsive UI design in flutter. Then I debuged it in my android emulator. First orientation was portrait and It was a good. Then I changed Orientation and it was a bad UI which isn't expected. If I hot restart or hot reload UI changed that is came expected. I have to reload or restart always after changing orientation. Settings already made to autoreloading after save. How to resolve this issue?

CodePudding user response：

Yuu said that you are creating responsive UI which means that you are using width and height of the screen to make it responsive. When orientation changes then obviously width increased and height decreased so maybe you need to add check on orientation change. There are many ways of doing that here is the simple one

return Scaffold(
        key: scaffoldKey,
        body: OrientationBuilder(
          builder: (BuildContext context, Orientation orientation) {
            orientation == Orientation.portrait ? 
                      doSomeThingifportrait : doSomethingifLandscape;
          },
        ),
);

CodePudding user response：

You need to make your UI responsive. You can do it with the "MediaQuery". Exemple :

return Scaffold(
  appBar: AppBar(
    title: Text("Responsive Container"),
  ),
  body: Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Container(
          height: MediaQuery.of(context).size.height/ 4,
          width: MediaQuery.of(context).size.width/3,
          color: Colors.red,
          child: Center(child: Text("Hello There !")),
        ),
      ],
    ),
  ),
);