颤动中的列表视图涟漪效应答案

【问题标题】：listview ripple effect in flutter颤动中的列表视图涟漪效应
【发布时间】：2020-09-26 17:14:08
【问题描述】：

我在颤振中有一个简单的列表视图

final List<String> entries = <String>['A', 'B', 'C'];
final List<int> colorCodes = <int>[600, 500, 100];

ListView.builder(
  padding: const EdgeInsets.all(8),
  itemCount: entries.length,
  itemBuilder: (BuildContext context, int index) {
    return Container(
      height: 50,
      color: Colors.amber[colorCodes[index]],
      child: Center(child: Text('Entry ${entries[index]}')),
    );
  }
);

当我单击/点击它时，会出现一个圆圈波纹效果，然后会扩展到我在列表中单击的其余元素。我想改变这种行为并消除圆圈涟漪效应。相反，当有人单击列表中的一个元素时，我希望该元素突出显示并淡化整个元素。一个例子是whatsapp 应用程序。当你点击一个对话时，你会看到你在列表中点击的元素会闪烁整个元素的涟漪效果。您将看到一个矩形波纹效果，而不是您单击的圆形波纹效果，然后扩展到元素的其余部分

如何在颤动中更改列表视图的默认行为？如果我不清楚，请告诉我提前致谢

【问题讨论】：

标签： flutter

【解决方案1】：

在你的代码sn-p的第8行

返回 InkWell() 类而不是 Container()

喜欢这个

child: ListView.builder(
        itemCount: list.length,
        itemBuilder: (context, i) {
          return InkWell( 
            onTap: (){},
            child: Container(
              height: 50,
              color: Colors.amber[colorCodes[index]],
              child: Center(child: Text('Entry ${entries[index]}')),
            );
          );
        },
      ),

欲了解更多信息，请访问flutter.dev Documentation

【讨论】：