Standard IconButton doesn't show any ripple effect on child:
IconButton(
icon: Container(color: Colors.red,),
onPressed: () {},
)
So I tried fix it with Stack:
class MyIconButton extends StatelessWidget {
const MyIconButton({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
height: 100,
width: 100,
child: Stack(
fit: StackFit.loose,
children: [
Positioned.fill(
child: Container(
width: 40,
height: 40,
color: Colors.deepPurple,
),
),
Positioned.fill(
child: Material(
type: MaterialType.transparency,
shape: const CircleBorder(),
child: IconButton(
splashRadius: 50,
icon: Container(),
onPressed: () {
},
),
),
)
],
),
);
}
}
But this widget needs to have defined size of container, and when I define that size I can't show ripple effect outside of that container. I am open for suggestions.