Flutter 中的响应式 MultiChildRenderObjectWidget答案

【问题标题】：A responsive MultiChildRenderObjectWidget in FlutterFlutter 中的响应式 MultiChildRenderObjectWidget
【发布时间】：2020-09-28 21:06:34
【问题描述】：

我有一个 MultiChildRenderObjectWidget，它会将一些孩子定位在屏幕高度尺寸的底部上方或下方。我将孩子传递到我的小部件中，并最初根据我可以访问的屏幕尺寸对孩子进行布局，因为我在 RenderObject createRenderObject(BuildContext context) 函数中传递了 BuildContext。它似乎运作良好。

但是，当屏幕尺寸发生变化时，如何重新执行我的 RenderObject 上的 performLayout 以使其重新布局子级以适应新的屏幕尺寸？

class AuthContent extends MultiChildRenderObjectWidget {
  AuthContent({
    Key key,
    this.background,
    this.actionBar,
    this.loginForm,
    this.disclosure,
  })  : assert(background != null),
        assert(actionBar != null),
        assert(loginForm != null),
        assert(disclosure != null),
        super(
            key: key, children: [background, actionBar, disclosure, loginForm]);

  final Background background;
  final ActionBar actionBar;
  final Disclosure disclosure;
  final LoginForm loginForm;

  @override
  RenderObject createRenderObject(BuildContext context) {
    final screenSize = MediaQuery.of(context).size;
    return RenderAuthContent(screenSize: screenSize);
  }
}

【问题讨论】：

屏幕改变大小是什么意思？通过旋转屏幕从纵向切换到横向？
当然，这可能是一种情况，但也可以考虑桌面或网络，然后我会更改浏览器/窗口的大小。

标签： flutter user-interface flutter-layout

【解决方案1】：

在 Nick 的 How to Create a Flutter Widget Using a RenderObject 文章中找到了使用 RenderObject 的一个很好的例子。

我缺少的是updateRenderObject 方法。通过覆盖它，我可以将新属性传递给RenderObject，它可以在performLayout 方法期间使用。

  @override
  void updateRenderObject(
      BuildContext context, RenderAuthContent renderObject) {
    renderObject..screenSize = screenSize;
  }

就我而言，我关心屏幕尺寸的变化。

【讨论】：