Flutter如何去除TextButton按下时出现的蓝色阴影效果

TextButton的阴影效果由ButtonStyle中的elevation属性控制，只需要将不同交互状态下的elevation统一设为0即可完全移除按下时的阴影，两种实现方式如下：

• 单个TextButton单独设置
  直接在对应按钮的style参数中配置即可，示例代码如下：

  TextButton(
    onPressed: () {
      // 你的点击逻辑
    },
    style: ButtonStyle(
      // 所有状态下阴影高度都设为0，彻底移除阴影
      elevation: MaterialStateProperty.all(0),
      // 可选配置：如果同时需要去掉按下时的半透明高亮遮罩，可以添加下面这行
      // overlayColor: MaterialStateProperty.all(Colors.transparent),
      // 极端情况如果还有阴影残留，加这行强制阴影颜色全透明
      // shadowColor: MaterialStateProperty.all(Colors.transparent),
    ),
    child: const Text('无阴影按钮'),
  )
  

• 全局统一配置所有TextButton
  如果需要应用内所有TextButton默认都不带阴影，可以直接在MaterialApp的主题中配置，不需要逐个修改按钮：

  MaterialApp(
    theme: ThemeData(
      textButtonTheme: TextButtonThemeData(
        style: ButtonStyle(
          elevation: MaterialStateProperty.all(0),
          // 同样可以按需添加overlayColor、shadowColor的全局配置
        ),
      ),
    ),
    // 你的其他应用配置
    home: const HomePage(),
  )
  

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