flutter - 如何将视图放在列表视图之上？

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,
            ),
          ],
        ),
      );
    }
  }

标签： flutterdart

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
        ],
      ),
    ),