Question

我有一个列表视图，该视图平均分为两部分（作为背景）如何在其上方放置一个视图（100 * 100 w * h）？（此框应居中对齐并位于根的顶部）

这是我尝试过的代码-

  @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: ListView(
          children: <Widget>[
            Container(
              width: ((context.findRenderObject() as RenderBox).size.width),
              height: ((context.findRenderObject() as RenderBox).size.height)/2,
              color: darkGreen,
            ),
          //  SizedBox(width: 10,),
            Container(
              width: ((context.findRenderObject() as RenderBox).size.width),
              height: ((context.findRenderObject() as RenderBox).size.height)/2,
              color: Colors.grey,
            ),
          ],
        ),
      );
    }
  }

Answer 1

首先，您不需要此行：

((context.findRenderObject() as RenderBox).size.width)

您可以将其替换为：

double.infinity

，它将采用父Widget可以允许的最大宽度。

关于您的问题，您可以将ListView包裹在Stack中：

Container(
      width: double.infinity,
      height: double.infinity,
      child: Stack(
        children: <Widget>[
          ListView(
            children: <Widget>[
              Container(
                width: double.infinity,
                height:
                    ((context.findRenderObject() as RenderBox).size.height) / 2,
                color: darkGreen,
              ),
              //  SizedBox(width: 10,),
              Container(
                width: double.infinity,
                height:
                    ((context.findRenderObject() as RenderBox).size.height) / 2,
                color: Colors.grey,
              ),
            ],
          ),

          //place your desired widget here
        ],
      ),
    ),

如何将视图置于列表视图之上？

1 个答案: