flutter 选定特定微件时使背景变暗

idfiyjo8  于 2023-01-27  发布在  Flutter
关注(0)|答案(1)|浏览(156)

我正在做Flutter项目,我想实现一个功能,当用户从ListView.builder()GridView.builder()中选择一个项目(通过Tap或LongPress)时,该小部件应该高亮显示,背景应该变暗。
在这里,您可以看到它应该是什么样子:

我曾试图实现它使用背景过滤器以及覆盖,但两者都给出了不同的输出。

使用背景滤镜:当我尝试使用BackDropFilter模糊背景时,它把页面模糊的一半变成了unlbur,一半的部分变成了unlbur。

下面是参考代码:

ListView.builder(
        itemCount: 10,
        itemBuilder: (ctx, index) {
          return BackdropFilter(
            filter: ImageFilter.blur(
              sigmaX: index == 2 ? 10 : 0,
              sigmaY: index == 2 ? 10 : 0,
            ),
            child: const MessageCard(),
          );
        },
      )

我也尝试使用覆盖,但我不能选择多个项目,因为屏幕触摸是禁用时,覆盖它打开。
是否有任何定制的方法或包,我们可以实现达到这个结果?

v2g6jxz6

v2g6jxz61#

您必须将此package用于突出显示小部件并更改barrier colorhttps://pub.dev/packages/showcaseview

相关问题