颤振: SliverAppBar in LayoutBuilder

Question

我想用SliverAppBar使用Layout Builder来测量高度，然后在得到SliverAppBar高度之后，使用ScrollController创建这个高度的条件。

我有这样的代码：

CustomScrollView(
          controller: _scrollController,
          slivers: <Widget>[
            LayoutBuilder(
              builder: (context, constraint) {
                message = constraint.biggest.height.toString();
                return SliverAppBar(
                  floating: false,
                  pinned: true,
                  expandedHeight: ScreenUtil.getInstance().setHeight(250),
                  leading: Container(
                    color: Colors.blue.withOpacity(.5),
                    child: IconButton(
                      icon: Icon(Icons.arrow_back),
                      onPressed: () => Navigator.pop(context),
                    ),
                  ),
                  flexibleSpace: FlexibleSpaceBar(
                    // titlePadding: EdgeInsets.zero,
                    title: Container(
                      width: ScreenUtil.getInstance().setWidth(250),
                      child: Text(
                        message ?? "Null",
                        style: ResponsiveUI.textNamaWartawanStylWhite,
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
                    background: Container(
                      child: CachedNetworkImage(
                        fit: BoxFit.cover,
                        imageUrl:
                            "${Urls.BASE_API_IMAGE}/wartawan/${widget.gambarWartawan}",
                      ),
                    ),
                  ),
                  actions: <Widget>[
                    Container(
                      color: Colors.blue.withOpacity(.5),
                      child: IconButton(
                        icon: Icon(Icons.more_horiz),
                        onPressed: () => "",
                      ),
                    ),
                  ],
                );
              },
            ),
          ],
        ),

但我知道这个错误：

The following assertion was thrown building Listener:
A RenderViewport expected a child of type RenderSliver but received a child of type _RenderLayoutBuilder.

RenderObjects expect specific types of children because they coordinate with their children during layout and paint. For example, a RenderSliver cannot be the child of a RenderBox because a RenderSliver does not understand the RenderBox layout protocol.
The RenderViewport that expected a RenderSliver child was created by: Viewport ← IgnorePointer-[GlobalKey#4f27a] ← Semantics ← _PointerListener ← Listener ← _GestureSemantics ← RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#ed3fa] ← _PointerListener ← Listener ← _ScrollableScope ← _ScrollSemantics-[GlobalKey#c7130] ← RepaintBoundary ← ⋯
The _RenderLayoutBuilder that did not match the expected child type was created by: LayoutBuilder ← Viewport ← IgnorePointer-[GlobalKey#4f27a] ← Semantics ← _PointerListener ← Listener ← _GestureSemantics ← RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#ed3fa] ← _PointerListener ← Listener ← _ScrollableScope ← _ScrollSemantics-[GlobalKey#c7130] ← ⋯
User-created ancestor of the error-causing widget was
    CustomScrollView 
When the exception was thrown, this was the stack
#0      ContainerRenderObjectMixin.debugValidateChild.<anonymous closure> 
#1      ContainerRenderObjectMixin.debugValidateChild

你能帮我办案吗？谢谢。

Answer 1

你不能在CustomScrollView里放一个非条状的。您可能需要将布局构建器放置在FlexibleSpace的背景中。

Answer 2

试试SliverLayoutBuilder小部件。

解释：

您不能将非条小部件(如LayoutBuilder )放置在希望条作为子部件(如CustomScrollView )的小部件中。

例如，当您想要将填充添加到一个小块时，您应该使用SliverPadding小部件，而不是普通的Padding小部件。类似地，也有一个LayoutBuilder的小版本，叫做SliverLayoutBuilder。