flutter 使用 stack 创建 ui。浮动按钮应该在小部件上方

Question

我正在尝试创建 ui，如下图所示。但按钮隐藏在列表后面。使用 button.Please 的 Positioned 小部件时还面临按钮不点击的问题，建议如何使用 Stack 小部件和 ListView & Floating button 在下方创建 UI。

UI

Container(
  color: Colors.grey,
  child: Column(
    children: <Widget>[
      Stack(
        children: <Widget>[
          Column(
            children: <Widget>[
              Container(
                height: 250.0,
                width: MediaQuery.of(context).size.width,
                child: Image.asset(
                  "images/1.jpg",
                  fit: BoxFit.cover,
                ),
              )
            ],
          ),
          Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: <Widget>[
              Container(
                height: 220.0,
              ),
              Container(
                padding: EdgeInsets.only(right: 15.0),
                child: FloatingActionButton(
                  onPressed: () {},
                  child: Icon(Icons.favorite),
                ),
              ),
            ],
          ),
          Column(
            children: <Widget>[
              Container(
                height: 250.0,
              ),
              Container(
                height: MediaQuery.of(context).size.height - 250.0,
                child: ListView.builder(
                  shrinkWrap: true,
                  itemBuilder: (context, index) {
                    return Card(
                      child: ListTile(
                        title: Text("Title $index"),
                        leading: Icon(Icons.home),
                      ),
                    );
                  },
                  itemCount: 15,
                ),
              ),
            ],
          )
        ],
      ),
    ],
  ),
);

Answer 1

根据文档 (https://docs.flutter.io/flutter/widgets/Stack-class.html)：

The stack paints its children in order with the first child being at the bottom

所以你的Stackchildren的顺序是错误的。您当前的订单是：

页眉
按钮
列表

但应该是：

页眉
列表
按钮

否则列表是重叠按钮。

flutter 使用 stack 创建 ui。浮动按钮应该在小部件上方

flutter create ui using stack . Floating Button should be over the widget

flutter

flutter-layout