1

这是代码

body: Center(
          child: Column(
            children: [
              Row(
                children: [
                  CircleAvatar(
                    backgroundImage: NetworkImage(
                        'https://raw.githubusercontent.com/flutter/website/master/examples/layout/sizing/images/pic1.jpg'),
                    radius: 50,
                  ),
                  SizedBox(
                    width: 30,
                  ),
                  Container(
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      children: [
                        Text('Post'),
                        Text('Followers'),
                        Text('Following')
                      ],
                    ),
                  )
                ],
              ),
            ],
          ),
        ),

在此处输入图像描述

4

2 回答 2

1

试试下面的代码希望它对你有帮助,用过的 ListTile 小部件也可以在这里参考 ListTile 在这里参考我的答案以获得相同的设计

 ListTile(
      leading: CircleAvatar(
        backgroundImage: NetworkImage(
          'https://raw.githubusercontent.com/flutter/website/master/examples/layout/sizing/images/pic1.jpg',
        ),
        radius: 50,
      ),
      title: Container(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Text('Post'),
            Text('Followers'),
            Text('Following'),
          ],
        ),
      ),
    ),

你的结果屏幕像->图片

于 2021-10-28T17:28:16.767 回答
1

容器不会占用所有铰孔空间(为容器提供背景颜色并查看)。这就是你看不到的原因MainAxisAlignment.spaceEvenly,。使用占用所有剩余空间的扩展小部件。然后你会看到效果。

没有子容器的容器会尽量大,除非传入的约束是无限的,在这种情况下,它们会尽量小。带有孩子的容器根据孩子的大小调整自己的大小。构造函数的宽度、高度和约束参数会覆盖它。

Column(
        children: [
          Row(
            children: [
              CircleAvatar(
                backgroundImage: NetworkImage(
                    'https://raw.githubusercontent.com/flutter/website/master/examples/layout/sizing/images/pic1.jpg'),
                radius: 50,
              ),
              SizedBox(
                width: 30,
              ),
              Expanded(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Text('Post'),
                    Text('Followers'),
                    Text('Following')
                  ],
                ),
              )
            ],
          ),
        ],
      ),
于 2021-10-28T17:31:20.297 回答