Flutter: значок положения рядом с центрированным кругом Аватар - PullRequest
0 голосов
/ 17 июня 2020

Я пытаюсь поместить значок редактирования в правом верхнем углу рядом с аватаром в центре круга. Но если я использую центральный виджет внутри виджета строки, он не работает:

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),
              ],
            ),

Это должно выглядеть так:

Ответы [ 2 ]

0 голосов
/ 17 июня 2020

Вы можете обернуть значок редактирования виджетом-контейнером и выровнять его по верхнему правому краю следующим образом:

Container(
   height: 140,
   alignment: Alignment.topRight,
   child: Icon(Icons.edit),
),
0 голосов
/ 17 июня 2020

Попробуйте использовать стек:

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...