Flutter выравнивает содержимое IconButton по родительским границам

Можно ли выровнять содержимое IconButton (значок) с границей родительского виджета?

Получил такой код

       Padding(
        padding: const EdgeInsets.symmetric(horizontal: 20),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            IconButton(
                onPressed: () {
                  Navigator.of(context).pop();
                },
                splashRadius: 20,
                constraints: BoxConstraints(),
                padding: EdgeInsets.zero,
                icon: SvgPicture.asset('assets/icons/arrow_left.svg', color: primaryColor)
            )
          ],
        )
    );

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

С помощью этого параметра можно разместить значок в том месте, где он мне нужен, но анимация всплеска при нажатии остается невыровненной.

       alignment: Alignment.centerLeft

Итак, он делает что-то вроде этого (вертикальная линия разметки - это граница родительского виджета)

Но мне это нужно

2 ответа

Я считаю, что это нужно делать с ресурсом, а не с кодом.

              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 20),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: <Widget>[
                    IconButton(
                      constraints: BoxConstraints(),
                      padding: EdgeInsets.zero,
                      icon: Icon(Icons.arrow_back, size: 20),
                      splashRadius: 20,
                      onPressed: () => {},
                    ),
                  ],
                )
            )

Я использовал ваш код, добавил к нему размер и использовал встроенный ресурс.

       icon: Icon(Icons.arrow_back, size: 20),

На выходе

h ttps:https://stackru.com/images/dfcf5722a02e8f7ab2eef3181dd7cf9a254d248c.png

Вы можете использовать его простым способом, как показано ниже.

     Padding(
        padding: const EdgeInsets.symmetric(horizontal: 20),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                  color: Colors.black12,
                  borderRadius: BorderRadius.circular(50)),
              child: Padding(
                padding: const EdgeInsets.all(16.0),
                child: IconButton(
                    onPressed: () {
                      Navigator.of(context).pop();
                    },
                    constraints: BoxConstraints(),
                    padding: EdgeInsets.zero,
                    icon: SvgPicture.asset('assets/icons/arrow_left.svg',
                        color: primaryColor)),
              ),
            )
          ],
        ))
Другие вопросы по тегам