How to: Remove separator from ListView.separated when dismissing widget?

Viewed 1328

I'm using a ListView.separated to build a list of Dismissible widgets but when one of those is dismissed the separator does not disappear.

How can I remove the separator when the widget is dismissed?

2 Answers

In this example separator removed successfully

final items = List<String>.generate(20, (i) => "Item ${i + 1}");
    
      @override
      Widget build(BuildContext context) {
        final title = 'Dismissing Items';
    
        return MaterialApp(
          title: title,
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: Scaffold(
            appBar: AppBar(
              title: Text(title),
            ),
            body: ListView.separated(
              itemCount: items.length,
              itemBuilder: (context, index) {
                final item = items[index];
    
                return Dismissible(
                  // Each Dismissible must contain a Key. Keys allow Flutter to
                  // uniquely identify widgets.
                  key: Key(item),
                  // Provide a function that tells the app
                  // what to do after an item has been swiped away.
                  onDismissed: (direction) {
                    // Remove the item from the data source.
                    setState(() {
                      items.removeAt(index);
                    });
    
                    // Then show a snackbar.
                    ScaffoldMessenger.of(context)
                        .showSnackBar(SnackBar(content: Text("$item dismissed")));
                  },
                  // Show a red background as the item is swiped away.
                  background: Container(color: Colors.red),
                  child: ListTile(title: Text('$item')),
                );
              },
              separatorBuilder: (BuildContext context, int index) => Divider(),
            ),
          ),
        );
      }

make sure you are calling setState when removing item from the list ,

other approach is to use ListView.builder which does not come with separator by default and then add your own , by wrapping the child of dismissible by column and add Divider as second child

Dissmissable(Colmun(YourWidget,Divider)))

Related