如何在“颤振”中较小行内的中心对齐大图标？

debugcn 发表于 Dev

迪帕克

我正在尝试实现以下布局：

以下是我的代码：

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.center,
  children: [
    Icon(
      Icons.fast_rewind,
    ),
    SizedBox(
      width: 20,
    ),
    Icon(
      Icons.pause_circle_filled,
      size: 60,
    ),
    SizedBox(
      width: 20,
    ),
    Icon(
      Icons.fast_forward,
    ),
  ],
),

这样，我得到的是：

我认为crossAxisAlignment：CrossAxisAlignment.center将使“暂停”按钮居中。但事实并非如此。如果我删除暂停按钮的大小为60，则可以正常工作。但是，我希望此按钮更大。

如何获得所需的布局？

莱文·坎塔罗格鲁

堆栈小部件可能会为您提供帮助。根据Z轴定位小部件

给出想法的样本：

 Stack(children: [
          Padding(
            padding: EdgeInsets.all(20),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Icon(
                  Icons.fast_rewind,
                ),
                Icon(
                  Icons.fast_forward,
                ),
              ],
            ),
          ),
          Positioned.fill(
            child: Center(
              child: Icon(
                Icons.pause_circle_filled,
                size: 60,
              ),
            ),
          ),
        ],
  ),

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。