Home / Questions / 272676
Accepted
Richard
Asked: 2020-06-18 08:53:54 +0800 CST 2020-06-18 08:53:54 +0800 CST

How to put a divider line in Listview

  • 772

I try to place a dividing line between each item ListViewthat is filled with the elements of an Array being as follows

body: ListView(
    children: litems
        .map((data) => ListTile(
              title: Text(data),
              trailing: PopupMenuButton(
                  onSelected: removeItemSelecteMenu,
                  icon: Icon(Icons.delete),
                  itemBuilder: (context) => [
                        PopupMenuItem(
                          value: data,
                          child: Text("Eliminar"),
                        )
                      ]),
            ))
        .toList(),
  ),

I try to do it the following way

body: ListView(
    children: litems
        .map((data) => ListTile.divideTiles(
          context: context,
              title: Text(data),
              trailing: PopupMenuButton(
                  onSelected: removeItemSelecteMenu,
                  icon: Icon(Icons.delete),
                  itemBuilder: (context) => [
                        PopupMenuItem(
                          value: data,
                          child: Text("Eliminar"),
                        )
                      ]),
            ))
        .toList(),
  ),

but it sends me an error in the following lines or code

children: litems

title:

trailing:

when going to review the error children: litemsshows me the following

The argument type 'List<Iterable<Widget>>' can't be assigned to the parameter type 'List<Widget>'
listview

1 Answers

  1. Best Answer

    You can review the parameters that the method receives divideTilesto understand how it works, the correct thing would be to do it this way:

    return Scaffold(
      body: ListView(
        children: ListTile.divideTiles(
          color: Colors.black,
          tiles: litems
              .map((data) => ListTile(
                    title: Text(data),
                    trailing: PopupMenuButton(
                        onSelected: removeItemSelecteMenu,
                        icon: Icon(Icons.delete),
                        itemBuilder: (context) => [
                              PopupMenuItem(
                                value: data,
                                child: Text("Eliminar"),
                              )
                            ]),
                  ))
              .toList(),
        ).toList(),
      ),
    );

    Another option you have is to use the ListView.separated , here is an example of how to implement it:

    https://medium.com/flutter-community/flutter-adding-separator-in-listview-c501fe568c76

    • 0