Flutter mainaxisAlignment.space甚至无法在多个flex(行和列)上使用

时间:2018-10-10 10:54:25

标签: flutter

我正在创建类似Instagram个人资料的屏幕,但 mainaxisAlignment.spaceEvenly 无法正常工作。如果该行不在任何其他行或列内,则工作正常,但在这种情况下则没有。 我该如何解决?请帮忙。

Container(
                margin: EdgeInsets.all(15.0),
                child: Column(
                  children: <Widget>[
                    Row(
                      children: <Widget>[
                        Container(
                          width: 100.0,
                          height: 100.0,
                          margin: EdgeInsets.only(
                            right: 10.0,
                          ),
                          decoration: new BoxDecoration(
                            shape: BoxShape.circle,
                            image: new DecorationImage(
                              fit: BoxFit.fill,
                              image: new CachedNetworkImageProvider(
                                profile.dp,
                                scale: 100.0,
                              ),
                            ),
                          ),
                        ),
                        Column(
                          children: <Widget>[
                            Row(
                              mainAxisAlignment:
                                  MainAxisAlignment.spaceEvenly,
                              children: <Widget>[
                                Column(
                                  children: <Widget>[
                                    Text(
                                      profile.postcount.toString(),
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold),
                                    ),
                                    Text('posts'),
                                  ],
                                ),
                                Column(
                                  children: <Widget>[
                                    Text(
                                      profile.followers.toString(),
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold),
                                    ),
                                    Text('followers'),
                                  ],
                                ),
                                Column(
                                  children: <Widget>[
                                    Text(
                                      profile.followings.toString(),
                                      style: TextStyle(
                                          fontWeight: FontWeight.bold),
                                    ),
                                    Text('following'),
                                  ],
                                ),
                              ],
                            ),
                            new RaisedButton(
                              child: Text('Edit Profile'),
                              onPressed: () {},
                            ),
                          ],
                        )
                      ],
                    )
                  ],
                )),

期望:

现实:

1 个答案:

答案 0 :(得分:2)

你在这里

enter image description here

Widget _buildRow() {
  return Container(
    padding: const EdgeInsets.all(16),
    child: Row(
      children: <Widget>[
        CircleAvatar(
          radius: 40,
          backgroundImage: AssetImage("your_image_asset"),
        ),
        SizedBox(width: 12),
        Expanded(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: <Widget>[
                  Column(
                    children: <Widget>[
                      Text("2", style: TextStyle(fontWeight: FontWeight.bold)),
                      Text("Gold", style: TextStyle(color: Colors.grey)),
                    ],
                  ),
                  Column(
                    children: <Widget>[
                      Text("22", style: TextStyle(fontWeight: FontWeight.bold)),
                      Text("Silver", style: TextStyle(color: Colors.grey)),
                    ],
                  ),
                  Column(
                    children: <Widget>[
                      Text("5464", style: TextStyle(fontWeight: FontWeight.bold)),
                      Text("Reputation", style: TextStyle(color: Colors.grey)),
                    ],
                  ),
                ],
              ),
              OutlineButton(onPressed: () {}, child: Text("CopsOnRoad (Edit Profile)")),
            ],
          ),
        ),
      ],
    ),
  );
}