flutter 怎么消除按钮事件的点击溅射背景

flutter 怎么消除按钮事件的点击溅射背景


前言

在flutter 中,大部分事件组件都有一个溅射背影,但是假如某天需求让我们取消点击溅射效果,我们该怎么办呢?本篇文章将记录怎么取消溅射效果。


一、设置 ThemeData

在我们的启动文件中,添加主题

MaterialApp(
  theme: ThemeData(
    splashColor: Colors.transparent,
    highlightColor: Colors.transparent,
    hoverColor: Colors.transparent,
  ),
)

上面的代码,会取消掉所有点击事件的溅射效果

二、Theme 设置

在主题中设置某一个组件的Theme,即插入父Theme小部件将其应用于某个小部件子树

Theme(
  data: Theme.of(context).copyWith(
    splashColor: Colors.transparent,
    highlightColor: Colors.transparent,
    hoverColor: Colors.transparent,
  )
  child: child,
)

上面的代码可以限定只有某一种或多种类型的按钮事件,取消溅射效果

三、单独设置

即只为单独某一个点击事件设置取消溅射效果

          IconButton(
            onPressed: () {
    
    },
            icon: Icon(Icons.search),
            splashColor: Colors.transparent,
            highlightColor: Colors.transparent,
            hoverColor: Colors.transparent,
          ),

代码运行效果如下

在这里插入图片描述

经过你的设置之后,点击事件将不会再有溅射效果了


总结

本篇文章记录的内容比较简单,但比较实用,如果你正好需要,点个赞再走呗。

猜你喜欢

转载自blog.csdn.net/u010755471/article/details/128013215