如何更改 Stack 中 Container 的位置？

Question

我试图在我的堆栈中显示一个按钮，但它没有得到正确的位置。该按钮是回复按钮。我添加了一只脚，现在您可以检查它，我想要的是在底部 window 的右侧显示它，底部和按钮之间有一点间距。希望任何人都可以提供帮助。如果您需要更多信息，请发表评论。

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    try {
      return Scaffold(
        body: StreamBuilder(
            stream: mystreamofallvideos,
            builder: (context, snapshot) {
              if (snapshot.hasData &&
                  snapshot.connectionState != ConnectionState.waiting) {
                return PageView.builder(
                    itemCount: snapshot.data.docs.length,
                    controller:
                        PageController(initialPage: 0, viewportFraction: 1),
                    scrollDirection: Axis.vertical,
                    itemBuilder: (context, index) {
                      DocumentSnapshot videos = snapshot.data.docs[index];

                      return Stack(children: [
                        Videoplayeritem(widget.videoid),

                        Column(children: [
                          Align(
                            alignment: Alignment.bottomLeft,
                            child: Container(
                              height: 100,
                              child: Row(
                                crossAxisAlignment: CrossAxisAlignment.center,
                                mainAxisSize: MainAxisSize.max,
                                children: [
                                  IconButton(
                                      icon: Icon(
                                        Icons.close,
                                        color: Colors.white,
                                        size: 35,
                                      ),
                                      onPressed: () {
                                        Navigator.of(context).pop();
                                      }),
                                  SizedBox(
                                    width: 190,
                                  ),
                                ],
                              ),
                            ),
                          ),
                          Container(
                            color: Colors.red,
                            width: 210,
                            height: 94,
                            //color: Colors.blue.withOpacity(0.5),

                            child: InkWell(
                              onTap: () => sharevideo(
                                  widget.videoid, videos.data()['id']),
                              child: Icon(Icons.reply,
                                  size: 55, color: Colors.white),
                            ),
                          ),
                        ]),

                        //starssonthe right
                      ]);
                    });
              } else {
                return Center(child: CircularProgressIndicator());
              }
            }),
      );
    } catch (e) {
      e.toString();
    }
  }
}

这是它的样子

enter image description here

Answer 1

您可以使用 Positioned 或 Align 小部件包装您的容器

喜欢：

Positioned(
                top: 0.0,
                left: 0.0,
                child: Icon(Icons.message,
                    size: 128.0, color: Colors.greenAccent[400]), //Icon
              ),

Answer 2

对齐并在底部添加填充：

Align(
  alignment: Alignment.bottomRight,
  child: Container(
  height: 40,
  padding: const EdgeInsets.only(bottom: 16),
  child: OutlinedButton(
           onPressed: () {},
           child: Text('mybutton'),
           ),
 )

如何更改 Stack 中 Container 的位置？

How to change position of Container inside Stack?

stack

containers

dart

material-design

flutter