Flutter 中的斑马条纹 ListView 了解如何在 Flutter 应用程序中创建斑马条纹列表视图

1_In32QK4xZe_oK8ATn-Yepw.gif

介绍:

想象一下您的手机或电脑屏幕上有一个内容列表。现在,想象一下列表中的所有内容都有替代颜色。例如,主要的事物可能是白色的,后续的事物可能是黑色的,第三个事物可能再次是白色的,等等。这被称为斑马条纹列表视图。因其看起来像斑马的条纹而得名。预计这将使该列表更具吸引力且更易于阅读。它可以帮助您更快更好地找到您要搜索的内容。

如何在 dart 文件中实现代码:

您需要分别在代码中实现它:

main.dart在文件夹内创建一个名为 的新 dart 文件lib。

要在 Flutter 中创建条带化 ListView(使用 ListView.builder() 构造函数),您可以利用 itemBuilder 参数根据其索引返回所有内容的备用小部件。在大多数情况下,您可以使用三元运算符来向后移动并在两种颜色之间交替显示所有内容的背景,如下所示:

ListView.builder(
  itemCount: 132,
  itemBuilder: (context, index) {
    return Container(
      // alternate colors
      color: index % 2 == 0 ? Colors.red : Colors.green, 
      /*...*/
    );
  },
);

首先,我们将为列表生成虚拟数据

final List<String> it

猜你喜欢

转载自blog.csdn.net/iCloudEnd/article/details/133300512