Blog

This is dismissible ListView item step by step example.

Example 1: Flutter Dismissible ListView Examples

Category:

Topic:

This is dismissible ListView item step by step example.

Example 1: ListView Dismiss Item

Here is the demo:

This example will comprise the following files:

• DismissibleExample.dart

Step 1: Create Project.

1. Open your favorite Flutter IDE.
2. Go to File-->New-->Project to create a new project.

Step 2: Dependencies.

No external dependencies are needed for this project.

Step 4: Write Dart Code

Write your code as follows:

*(a). DismissibleExample.dart

Create a file Dart named DismissibleExample.dart

Here is the full code

import 'package:flutter/material.dart';
class DismissibleExample extends StatelessWidget {
  final String title;
  const DismissibleExample(this.title);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: ListView.builder(
        itemBuilder: (context, index) => Dismissible(
          key: Key(index.toString()),
          background: Container(
            color: Colors.red,
          ),
          onDismissed: onDismissed,
          movementDuration: const Duration(seconds: 1),
          secondaryBackground: Container(
            color: Colors.yellow,
          ),
          child: ListTile(
            title: Text("Tile $index"),
          ),
        ),
      ),
    );
  }
  void onDismissed(DismissDirection index) {
    print("$index removed");
  }
}

Run

Simply copy the source code into your Flutter Project, Build and Run.

Reference.

Download code here.
Follow code author here.

Read Individually.

---