singlechildscrollview 和堆栈的布局问题答案

【问题标题】：Layout issue with singlechildscrollview and stacksinglechildscrollview 和堆栈的布局问题
【发布时间】：2021-09-02 23:22:36
【问题描述】：

为什么这段代码不正确？

我有这个错误：

RenderBox 未布置：RenderRepaintBoundary#681d3 relayoutBoundary=up1 NEEDS-PAINT 'package:flutter/src/rendering/box.dart': 断言失败：第 1930 行第 12 行：'hasSize'

相关的导致错误的小部件是脚手架库...\rank\rankView.dart:23

我应该定义脚手架的尺寸吗？

SafeArea(
  child: Scaffold(
    resizeToAvoidBottomInset: false,
    body: SingleChildScrollView(
      child: Stack(children: <Widget>[
        Positioned(
            top: 550,
            left: 8,
            right: 8,
            bottom: 0,
            child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  for (final result in controller.results)
                    Container(height: 50, color: Colors.black),
                ]))

【问题讨论】：

我怀疑它是脚手架内的小部件之一。列的大小不确定（希望适合其内容）。如果你在专栏上使用mainAxisSize: MainAxisSize.min，也许它会解决？
remove SingleChildScrollView 并且错误会消失，我相信这是由于 Stack 不知道在布局阶段放置定位的父母约束。
但我需要一个滚动视图。我该如何解决？
为什么在安全区域内有脚手架？

标签： flutter flutter-layout

【解决方案1】：

为什么您在安全区域内使用脚手架。如果你有这个作为屏幕。他们你可以简单地返回一个scaffold 并添加safearea 作为脚手架的子级。

return Scaffold(
 body: SafeArea(), );

喜欢这个

您正在使用堆栈在滚动视图内定位。我不认为这是一个好方法。因为堆栈中只有一个小部件。

所以你可以根据容器位置更好地使用它。然后将子column 添加到容器中。

所以你的代码可能看起来像这样，

Scaffold(
  resizeToAvoidBottomInset: false,
  body: SafeArea(
    child: SingleChildScrollView(
      child: Container(
 //you need to position from the top 550 and left right  8 units
 //that you can do by the margin or padding: 
       margin: EdgeInsets.only(top: 550, left: 8, right: 8),

            child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  for (final result in controller.results)
                    Container(height: 50, color: Colors.black),
                ],
              ),
            ),
         ),
        ),
      );

应该可以完美运行。

【讨论】：