Flutter Swipe to delete  –  Part 1 – Simple Listview

In this tutorial I am gone a show you how to create swipe to delete function to your app. It is pretty easy to implement that in flutter app using in build in widgest.

The key widget for implementing this kind of feature is Dismissible widget. You can control how the background should like and what happen after the swipe and many other things.

There are couple of argument we need to consider when implementing this feature.

  1. key
  2. onDismissed
  3. child

key — We must add key to identify each element individually. So we can use element Id kind of thing as a key.

onDismissed — onDismissed trigger after the swipe was completed. We can use this to remove our element from the array.

First I created stateful widget with and added method to generate 10 dummy items..

class CircleWidgets extends State<SwipeList>{
static List getDummyList(){
List list = List.generate(10, (i) {
return “Item ${i +1 }”;
});
return list;
}
List items = getDummyList();
}

Next I will override the build method and return the ListView.

In onDismissed method we need to remove items from the list. So we are changing the state and update the list item. Then the widget will redraw with new items.

Make Simple listview with Divider video

My Medium Article –

https://medium.com/flutterpub/flutter-3-swipe-to-delete-part-1-9d3b287eb779

Leave a Reply