与 Flutter 中的堆栈对齐

qoefvg9y 于 2023-05-19 发布在 Flutter

关注(0)|答案(2)|浏览(220)

项目

嗨，我试图在Flutter中对齐堆栈中的一些小部件。我的最终结果是这样的：

我知道这可以很容易地实现与行，但我想动画的位置，两个孩子，所以我被迫使用堆栈。
我的问题很简单

示例代码

return Container(
  child: Stack(
    children: <Widget>[
      Align(
        alignment: Alignment.centerLeft,
        child: _buildSign(),
      ),
      Align(
        alignment: Alignment.centerRight,
        child: _buildSign(),
      ),
    ],
  ),
);

这不会像我预期的那样渲染。无论我在alignment字段中输入什么：Alignment.centerRight和Alignment.centerLeft将始终将子节点放置在中间左侧。
只有当我给予 Package 容器一个固定的宽度时，这个问题才能解决。现在我明白为什么会发生这种情况了，但是如果我想让容器和他的孩子一样大呢？标签是一个动态文本，所以他的宽度是不可预测的我
有什么想法吗
谢谢

flutter

来源：https://stackoverflow.com/questions/58971105/alignment-with-stack-in-flutter

2条答案

按热度按时间

h7appiyu1#

Hy just AnotherOverflowUser，
在你的例子中，你必须在Stack Widget中使用Positioned Widget，它会给予你你想要的。
例如：

Positioned(
  left: 20.0,
  child: Icon(
    Icons.monetization_on, 
    size: 36.0, 
    color: const Color.fromRGBO(218, 165, 32, 1.0)
  )
)

赞(0）回复(0）举报 2023-05-19

ruyhziif2#

更灵活的方法是用Positioned.fill Package Align原始答案发表在这里Flutter: bottom center widget in stack

return Container(
  child: Stack(
    children: <Widget>[
      Positioned.fill(
       child: Align(
        alignment: Alignment.centerLeft,
        child: _buildSign(),
      ),),
      Positioned.fill(
       child:Align(
        alignment: Alignment.centerRight,
        child: _buildSign(),
      ),),
    ],
  ),
);

赞(0）回复(0）举报 2023-05-19

我来回答

与 Flutter 中的堆栈对齐

项目

示例代码

2条答案

相关问题

热门标签

最新问答