flutter - 在模拟器中更改方向时出现颤振调试问题

Question

我在 Flutter 中进行响应式 UI 设计。然后我在我的android模拟器中调试它。第一个方向是纵向的，这很好。然后我改变了方向，这是一个糟糕的用户界面，这是意料之中的。如果我热重启或热重载 UI 更改，这是意料之中的。更改方向后，我必须始终重新加载或重新启动。保存后已对自动重新加载进行了设置。如何解决这个问题？

Answer 1

你需要让你的 UI 响应式。您可以使用“MediaQuery”来完成。例子：

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 !")),
        ),
      ],
    ),
  ),
);

Answer 2

Yuu 说您正在创建响应式 UI，这意味着您正在使用屏幕的宽度和高度来使其具有响应性。当方向发生变化时，宽度明显增加，高度降低，因此您可能需要添加对方向变化的检查。有很多方法可以做到，这里是最简单的一种

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