flutter - 在 Flutter 中根据屏幕大小重新排列 UI 元素

Question

我查看了 flutter interact 19 keynote 视频，其中提到了一个即将推出的功能，可以根据屏幕大小调整和重新排列 ui。在这个视频中，17:30 分钟。
https://youtu.be/NfNdXgJZfFo
6 个月前它还处于“非常早期”阶段。有人知道它是否已经发布了吗？我相信不是 LayoutBuilder 或 MediaQuery.of()，因为它们在视频主题演讲之前可用。
我知道其他开发人员也有其他软件包，但我对 Google 的软件包很感兴趣。

Answer 1

我正在使用 MediaQuery.of(context).size;在我的项目中，在稳定 channel 中根据宽度更改布局。它对我有用，没有问题。我编写了一个区分大屏幕(平板电脑)和小屏幕(智能手机)的小部件。

class ScreenWidthBuilder extends StatelessWidget {
  final Widget Function(BuildContext context, bool isAWideScreen)  builder;
  final int bigScreenUpFrom;

  const ScreenWidthBuilder({Key key, @required this.builder, this.bigScreenUpFrom = 600}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Size screenSize = MediaQuery.of(context).size;
    // screenSize.width changes depending on screen orientation
    bool isAWideScreen = screenSize.width >= this.bigScreenUpFrom;
    return this.builder(context, isAWideScreen);
  }
}

首先我尝试使用 LayoutBuilder小部件，但我能够使用 MediaQuery.of(context).size; 获得更好的结果.使用 MediaQuery，您可以请求有关设备屏幕的许多数据(大小、textScaleFactor、方向等)。
有关更多信息，请查看:

LayoutBuilder 的文档

MediaQuery 的文档和 MediaQueryData从 MediaQuery.of(context) 返回.