繁体   English   中英

Flutter 将分隔线添加到 ListTile

[英]Flutter add separation lines to ListTile

在我的最后一个问题之后,我能够在 ListTile 小部件中显示数据库中的所有数据,但是如何添加一些行来分隔它。

return ListView.builder(
        itemCount: int.parse(_resultLength),
        itemBuilder: (context, index) {
          return Column(
            children: _Users
                .map(
                  (user) => ListTile(
                    leading: Container(
                      height: 47,
                      width: 47,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(6),
                        image: DecorationImage(
                          image: NetworkImage(user.imageLink),
                          fit: BoxFit.fill,
                        ),
                      ),
                    ),
                    title: Text(user.firstName + " " + user.lastName),
                    /*onTap: () {
                //_selectedUser = user;
                setState(() {});
              },*/
                  ),
                )
                .toList(),
          );
        },
      );

我尝试在ListTile之后使用Divider(),并将ListView.builder更改为ListView.separated 但是, children: _Users.map((user) =>).toList()阻止分隔符工作。 有没有办法在不改变太多当前代码的情况下添加它?

你在做什么有点奇怪......你不应该使用ListView来构建一个大的单个项目。

我假设_resultLength_Users列表的长度。 而不是构建包含整个_Users列表的单个项目,您应该尝试这样的事情

return ListView.separated(
  separatorBuilder: (BuildContext context, int index) => Divider(height: 1),
  itemCount: int.parse(_resultLength),
  itemBuilder: (context, index) {
    var user = _Users[index];
    return ListTile(
      leading: Container(
        height: 47,
        width: 47,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(6),
          image: DecorationImage(
            image: NetworkImage(user.imageLink),
            fit: BoxFit.fill,
          ),
        ),
      ),
      title: Text(user.firstName + " " + user.lastName),
      /*onTap: () {
            //_selectedUser = user;
            setState(() {});
          },*/
    );
  },

您将能够使用ListView.separated这种方法,

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM