InkWell没有显示涟漪效应

点击容器触发onTap()处理程序，但不会显示任何墨水飞溅效果。

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new InkWell(
          onTap: (){print("tapped");},
          child: new Container(
            width: 100.0,
            height: 100.0,
            color: Colors.orange,
          ),
        ),
      ),
    );
  }
}

我试着把InkWell放在容器里，但徒劳。

当前回答

添加onTap:(){}监听器后，涟漪效应应该工作良好。如果你在InkWell()小部件中使用BoxShadow()，它就不工作了。

2020-08-18 04:29:31

其他回答

对我来说，这是另一个问题。InkWell没有显示涟漪效应，当我有onTap功能作为我的小部件定义如下参数。

Function(Result) onTapItem;
...
onTap: onTapItem(result),

我不知道有什么不同，但下一个代码工作得很好。

onTap: (){ onTapItem(result); },

2020-11-03 11:32:58

您可能已经在主题或材质的父元素中设置了属性

ThemeData(
 ...
 splashFactory: NoSplash.splashFactory,
 ...
)

如果你不想要飞溅效果的特定使用它明确

 InkWell(
          splashFactory: NoSplash.splashFactory,
          ...
          child: Row(
          ...
          )
        );

2022-10-31 17:15:49

一行:

在InkWell中使用splashColor小部件。

InkWell(
  onTap: () {}, // Handle your onTap 
  splashColor: Colors.grey,
  child: Container(
    width: 200,
    height: 200,
  ),
)

2022-06-09 12:30:03

截图:

使用墨水小部件包装在一个InkWell。

InkWell(
  onTap: () {}, // Handle your onTap 
  child: Ink(
    width: 200,
    height: 200,
    color: Colors.blue,
  ),
)

2018-10-08 08:11:22

这对我来说很管用:

Material(
    color: Colors.white.withOpacity(0.0),
    child: InkWell(
      splashColor: Colors.orange,
      child: Text('Hello'), // actually here it's a Container wrapping an image
      onTap: () {
        print('Click');
      },
    ));

在这里尝试了很多答案后，我得出的答案是:

设置splashColor 在材质中包装InkWell(颜色:Colors.white.withOpacity(0.0)， ..)

感谢这里的答案让我明白了这两点

2020-09-03 18:48:19

InkWell没有显示涟漪效应

推荐文章

最新文章

标签