如何移除Flutter中TextButton组件的点击动画？

问题代码 #

TextButton CameraOpeningButton() {
    return TextButton(
      onPressed: () {
        initCamera();
      },
      child: Image(
        image: AssetImage('assets/SVG/CameraButton.png'),
        height: 70,
        width: 70,
      ),
    );
  }
}

点击上述按钮时会出现蓝色的点击动画波纹，需要移除该效果。

解决代码 #

TextButton CameraOpeningButton() {
    return TextButton(
      onPressed: () {
        initCamera();
      },
      style: TextButton.styleFrom(
        // 禁用水波纹动画
        splashFactory: NoSplash.splashFactory,
        // 移除点击时的背景层
        overlayColor: Colors.transparent,
      ),
      child: Image(
        image: AssetImage('assets/SVG/CameraButton.png'),
        height: 70,
        width: 70,
      ),
    );
  }
}

关键说明 #

• splashFactory: NoSplash.splashFactory：直接关闭按钮的水波纹点击动画
• overlayColor: Colors.transparent：确保点击时不会出现半透明的背景反馈，彻底消除点击时的视觉变化

内容的提问来源于stack exchange，提问作者Abhishek Tiwari