Flutter 如何向下展开定位的容器？

我试图复制一个设计，但我很难做到这一点。 在这个页面上，我试图将蓝色容器堆叠在图像上并向下展开，但无法向下展开。我用的是奇怪的颜色，所以对比度可以在那里看到。我不想使用列，因为它没有“堆叠”效果。我觉得有一种更优雅的方式可以做到这一点

这就是它目前的样子

class IndividualNewsPage扩展了无状态小部件{
最后一个字符串articleURL；
个人新闻页（{this.articleURL}）；
@凌驾
小部件构建（构建上下文）{
最终屏幕高度=MediaQuery.of（context）.size.height；
返回安全区(
孩子：脚手架(
背景颜色：Colors.red，
正文：专栏(
儿童：[
填充物(
填充：所有（30），
孩子：排(
儿童：[
材料(
颜色：颜色。透明，
孩子：InkWell(
onTap:（）=>Navigator.pop（上下文），
子：图标(
Icons.arrow\u back\u ios，
颜色：颜色。灰色，
))),
垫片（），
正文(
DateFormat.yMMMMd（“en_US”）.format（DateTime.now（）），
样式：TextStyle(
颜色：颜色。黑色54，
fontWeight:fontWeight.w600，
尺寸:15),，
),
],
),
),
大小盒子(
身高：10，
),
堆叠(
儿童：[
划船(
儿童：[
扩大(
孩子：ClipRRect(
borderRadius：仅限borderRadius(
左上：半径。圆形（20），
右上角：半径。圆形（20）），
子：容器(
身高：400，
装饰：盒子装饰(
颜色：颜色，蓝色，
图像：装饰图像(
图像：网络图像（articleURL），
适合：BoxFit.fill），
),
),
),
],
),
定位(
底部：30.0，
左:0,，
右:0,，
子：容器(
装饰：盒子装饰(
颜色：颜色，蓝色，
borderRadius：仅限borderRadius(
右上角：半径。圆形（20），
左上角：半径。圆形（20）），
子：列(
儿童：[
填充物(
填充：常数边集全部（16.0），
子：文本(
“纽约”，
样式：TextStyle(
字体大小：20.0，
fontWeight:fontWeight.bold，
),
),
),
填充物(
填充：常数边集全部（16.0），
子：文本(
“Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是该行业的标准虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本字体样本书。”），
),
],
),
),
),
],
)
],
),
),
);
}
}

在

扩展的

小部件中包装

堆栈

。它将填充可用高度，蓝色小部件将位于

列的底部

。。。，
扩大(
子：堆栈（…）
),
...

您可以在main方法中将
debugPaintSizeEnabled
设置为
true
，以便查看小部件的边框、边距、位置。。。在构建UI时，它有助于解决小部件定位和大小调整问题


导入“包：flatter/rendering.dart”
void main（）{
debugPaintSizeEnabled=true；
runApp（）；
}
我修改了代码
class IndividualNewsPage extends StatelessWidget {
  final String articleURL;
  IndividualNewsPage({this.articleURL});

  @override
  Widget build(BuildContext context) {
    final screenHeight = MediaQuery.of(context).size.height;
    return SafeArea(
      child: Scaffold(
        backgroundColor: Colors.red,
        body: Column(
          children: <Widget>[
            Padding(
              padding: EdgeInsets.all(30),
              child: Row(
                children: <Widget>[
                  Material(
                      color: Colors.transparent,
                      child: InkWell(
                          onTap: () => Navigator.pop(context),
                          child: Icon(
                            Icons.arrow_back_ios,
                            color: Colors.grey,
                          ))),
                  Spacer(),
                  Text(
                    DateFormat.yMMMMd("en_US").format(DateTime.now()),
                    style: TextStyle(
                        color: Colors.black54,
                        fontWeight: FontWeight.w600,
                        fontSize: 15),
                  ),
                ],
              ),
            ),
            SizedBox(
              height: 10,
            ),
            Stack(
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Expanded(
                      child: ClipRRect(
                        borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(20),
                            topRight: Radius.circular(20)),
                        child: Container(
                          height: 400,
                          decoration: BoxDecoration(
                              color: Colors.blue,
                              image: DecorationImage(
                                  image: NetworkImage(articleURL),
                                  fit: BoxFit.fill)),
                        ),
                      ),
                    ),
                  ],
                ),
                Positioned(
                  bottom: 30.0,
                  left: 0,
                  right: 0,
                  child: Container(
                    decoration: BoxDecoration(
                        color: Colors.blue,
                        borderRadius: BorderRadius.only(
                            topRight: Radius.circular(20),
                            topLeft: Radius.circular(20))),
                    child: Column(
                      children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.all(16.0),
                          child: Text(
                            "New York",
                            style: TextStyle(
                              fontSize: 20.0,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                        Padding(
                          padding: const EdgeInsets.all(16.0),
                          child: Text(
                              "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."),
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}