Flutter – Swipe to delete  listview items – Part 2

In last tutorial we created a simple swipe to delete view. In this we are going to add some icons and colors to the background layout of the list item.

In the Dismissible class there is a argument called background. For that we can add style,colors or icons for the background view which is show when swipe. We have to pass Widget object for that parameter. So let get start…

First we create a Container and we are going to add Icon for that Container like this.

background: Container(
alignment: AlignmentDirectional.centerEnd,
color: Colors.red,
child: Padding(
padding: EdgeInsets.fromLTRB(0.0, 0.0, 10.0, 0.0),
child: Icon(Icons.delete,
color: Colors.white,

In here we align our icon to the end and the center . Then it will show in the right end of the background view. We can make that view look more like delete view by adding red color to the background with white color icon..

Other than that you can see a little issue in here. You can swipe both left to right and right to left. But we can restrict that. There is argument under the Dismissible class and we can assign DismissDirection.endToStart to make that swipe only right to left.

This is the full code

Medium Article


Flutter swipe to delete listview

Leave a Reply