Как получить эффект пульсации круга на IconButton?

Оберните виджет InkWell виджетом Material, а виджет material должен иметь цвет.

 Material( color: Colors.transparent,
 child: InkWell( onTap: () { print("tapped"); }, ) );

В первом фрагменте кода, который вы завернули в InkWell, эффект не круговой, я думаю, вам нужен круговой эффект.

Вы можете напрямую использовать IconButton, а не обертывать его InkWell.

IconButton(
        icon: Icon(FontAwesomeIcons.chevronCircleUp),
        iconSize: 100,
        onPressed: () {},
        splashColor: Colors.blue,
      ),

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

Padding(
    padding: EdgeInsets.all(8.0),
    child: InkWell(
        customBorder: new CircleBorder(),
        onTap: () {},
        splashColor: Colors.red,
        child: new Icon(
            Icons.arrow_back,
            size: 24,
            color: Colors.black,
        ),
    ),
)

Эффект InkWell отображает квадрат, однако использование CircleBorder обрезает его до круглой формы.

По умолчанию эффект пытается заполнить пространство, поэтому, чтобы изменить размер, я добавил отступы со всех сторон, обрезав эффект. Если у вас по-прежнему возникают проблемы с тем, что волновой эффект вообще не отображается, обертывание вашего кода в Material() должно решить большинство проблем или взгляните на тему приложения.

Я использовал FAB без фона.

FloatingActionButton(
  onPressed: () {},
  backgroundColor: Colors.transparent,
  mini: true,
  child: Icon(
    Icons.more_vert,
    color: Colors.white,
  ),
)

            CircleAvatar(
                backgroundColor: Colors.grey[200],
                child: IconButton(
                  icon: Icon(
                    Icons.search,
                    color: Colors.black,
                  ),
                  onPressed: () {},
                ),
              ),

https://github.com/флюттер/флаттер/issues/3782

Если у вас не работает IconButton, вот объяснение.

TLDR: не устанавливайте фон для своего родительского контейнера и позволяйте материалу делать свою работу, рисуя рябь на фоне.

Вы можете просто использовать СыройМатериалКнопка со свойствами constraints и shapeчтобы создать значок с оттенком цвета и круглым фоном.
Также вы можете отключить свойство shape, чтобы кнопка была прямоугольной.

Примечание:
Здесь я использовал SVG-плагин, чтобы использовать желаемую иконку SVG (помещенную в папку assets/icons), но вы также можете просто использовать любой виджет Icon вместо него.

Пример:

RawMaterialButton(
  onPressed: () {}, //do your action
  elevation: 1.0,
  constraints: BoxConstraints(), //removes empty spaces around of icon
  shape: CircleBorder(), //circular button
  fillColor: Color(0xffff6464), //background color 
  splashColor: Colors.amber, 
  highlightColor: Colors.amber, 
  child: SvgPicture.asset(
    "assets/icons/heart.svg",
    width: 24,
    height: 24,
  ),
  padding: EdgeInsets.all(8),
)

Material(
  child: IconButton(
    icon: Icon(
      FontAwesomeIcons.search,
    ),
    onPressed: () {},
  ),
)

Добавление виджета материала в качестве парета работает для меня

Это сработало для меня, все вышеперечисленное решение сделало квадратную тень, а не круг

 Material(
              color: Colors.transparent,
                shape: CircleBorder(),
                clipBehavior: Clip.hardEdge,
        child : Icon() )

Вам нужно обернуть его материальным виджетом с прозрачным цветом фона:

Container(
    child:Material(
        color: Colors.transparent
        child: IconButton(
            icon: Icon(Icons.heart),
            onPressed: (){}
        ),
    ),
);

Ссылка на источник: https://github.com/flutter/flutter/issues/61811#issuecomment-660630611

У меня были проблемы с волновым эффектом, который не работал для ответа IconButton, а также для ответа Inkwell.

Оказалось, что это не связано с цветами фона, но что-то в моем обработчике onPressed отменяло эффект ряби. Может быть, другая анимация.

Это можно было подтвердить, поместив задержку в 200 мс внутри onPressed, и эффект пульсации вернулся.