Dismissible (Flutter Widget of the Week)

Flutter · 206K views · 2019 · 1:00

Open on YouTube

Software (other)UX & UI designtutorial

Why Stack Overflow recommends it

Stack Overflow users link it as a quick visual reference when answering how to implement swipe-to-delete or swipe-to-dismiss behavior in Flutter lists and sheets.

Recommended by 1 people across 1 different months, 2019 to 2022.

What it is

A one-minute entry in the Flutter team's Widget of the Week series covering the Dismissible widget, which lets users swipe list items away. It explains the two background slots for multi-direction swipes and the direction property for vertical swipes.

What people said

Recommends Marco · 2019-04 · Stack Overflow · on “How to implement a swipe to delete listview to remove data from firestore”

You should use Dismissible widget. I used it for an inbox list retrieved from Firestore. Inside your EachList return something like this return Dismissible( direction: DismissDirection.startToEnd, resizeDuration: Duration(milliseconds: 200), key: ObjectKey(snapshot.documents.elementAt(index)), onDismissed: (direction) { // TODO: implement your delete function and check direction if needed _deleteMessage(index); }, background: Container( padding: EdgeInsets.only(left: 28.0), alignment: AlignmentDirectional.centerStart, color: Colors.red, child: Icon(Icons.delete_forever, color: Colors.white,), ), // secondaryBackground: ..., child: ..., ); }); IMPORTANT: in order to remove the list item you'l

Cites BIS Tech · 2019-11 · Stack Overflow · on “flutter delete item from listview”

2019-November Latest way more information [this video] ListView.builder/GridView.builder( itemBuilder: (BuildContext context, int index){ return Dismissible( key: Key(selectServiceLocations[index].toString()), onDismissed: (direction) { setState(() { selectServiceLocations.removeAt(index); }); }, child: Container(...) } )

Cites Lerex · 2022-06 · Stack Overflow · on “Automatically check checkbox when user swipe right in Slidable widget”

Try using Dismissible widget ( [this video] ) and onDissmissed callback you can put a setstate changing the boolean for the checkbox In addition you can set the background to anything you want

Cites MendelG · 2022-07 · Stack Overflow · on “how to detect if the DraggableScrollableSheet is dropped down?”

To detect when the DraggableScrollableSheet was dropped, you can wrap it with a Dismissable [LINK] : Dismissible( direction: DismissDirection.vertical, key: Key('my_item'), onDismissed: (direction) { print('onDismissed'); }, child: DraggableScrollableSheet( // controller: controller, initialChildSize: 0.5, minChildSize: 0.0, maxChildSize: 1, builder: (_, scrollController) { return Container( decoration: BoxDecoration( color: Colors.red, border: Border.all(color: Colors.transparent), borderRadius: const BorderRadius.only( topLeft: Radius.circular(15), topRight: Radius.circular(15))), child: ListView(controller: scrollController, children: [ // nfController.myWidget, ]), ); }, )), Here [this video]