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