如何限制 ListView.builder 中的项目数？答案

【问题标题】：How do I limit the number of items in my ListView.builder?如何限制 ListView.builder 中的项目数？
【发布时间】：2021-09-10 03:35:58
【问题描述】：

我想将我的 ListView 的 itemCount 限制为最多 5 个，如果有更多项目，则添加文本“和更多”，并且仅显示 5 个或更少的项目。我试过使用itemCount: 5，但是当项目少于 5 时会返回错误。我该如何实现呢？

ListView.builder(
              shrinkWrap: true,
              itemCount: features.length,
              itemBuilder: (context, index) {
                return Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "•  ${features[index]}",
                        style: TextStyle(fontWeight: FontWeight.bold),
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
                  ],
                );
              }),

【问题讨论】：

标签： flutter dart flutter-layout

【解决方案1】：

您可以为 index > 5 返回空小部件

ListView.builder(
              shrinkWrap: true,
              itemCount: features.length,
              itemBuilder: (context, index) {
                return index > 5 ? SizedBox() : Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "•  ${features[index]}",
                        style: TextStyle(fontWeight: FontWeight.bold),
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
                  ],
                );
              }),

【讨论】：

【解决方案2】：

请试试这个

ListView.builder(
              shrinkWrap: true,
              itemCount: features.length=>5?5:features.length,
              itemBuilder: (context, index) {
                return Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Text(
                        "•  ${features[index]}",
                        style: TextStyle(fontWeight: FontWeight.bold),
                        overflow: TextOverflow.ellipsis,
                      ),
                    ),
                  ],
                );
              }),

【讨论】：

【解决方案3】：

itemCount: features.length < 5 ? features.length : 5,

【讨论】：