Flutter:居中CircleAvatar旁边的位置图标

问题描述 投票:0回答:1

我正在尝试在居中的圆形头像旁边的右上角放置一个编辑图标。但是,如果我在行窗口小部件中使用中心窗口小部件,它将无法正常工作:

Row(
              children: <Widget>[
                Center(
                  child:
                CircleAvatar(
                  radius: 70,
                  backgroundImage: NetworkImage(
                      ""),
                ),
                ),
                Icon(Icons.edit),
              ],
            )

并且如果我将行内容与mainaxisalignment居中,则它不会将化身居中,而是将化身与图标一起居中:

Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                CircleAvatar(
                  radius: 70,
                  backgroundImage: NetworkImage(
                      "https://autix.ch/wp-content/uploads/profile-placeholder.png"),
                ),
                Icon(Icons.edit),
              ],
            ),

It should look like this:

android flutter user-interface centering
1个回答
0
投票

尝试使用堆栈:

Container(
  width: 200,
  height: 200,
  child: Stack(
    children: <Widget>[
      Align(
        alignment: Alignment.topRight,
        child: Icon(Icons.access_time),
      ),
      Container(
        width: 200,
        height: 200,
        child: CircleAvatar(
          child: Text('Avatar'),
        ),
      ),
    ],
  ),
),

结果:

Result

© www.soinside.com 2019 - 2024. All rights reserved.