Learn How TO Delete Listview Item In Flutter Android App

Column(
  children: <Widget>[
    Padding(
      padding: const EdgeInsets.all(8.0),
      child: Container(
        padding: const EdgeInsets.all(10),
        height: 70,
        alignment: Alignment(0, 0),
        color: Colors.orange,
        child: Text(
          "To remove an item, swipe the tile to the right or tap the trash icon.",
          style: TextStyle(color: Colors.white),
        ),
      ),
    ),
    Padding(
      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
      child: Row(
        children: <Widget>[
          Text("Insert Data:"),
          Expanded(
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 20),
              child: TextField(
                controller: teController,
                onSubmitted: (text) {
                  setState(() {
                    if (teController.text != "") {
                      items.add(teController.text);
                    }
                  });
                  teController.clear();
                },
              ),
            ),
          ),
          RaisedButton(
            color: Colors.pink,
            child: Text("Insert",style: TextStyle(color: Colors.white),),
            onPressed: () {
              setState(() {
                if (teController.text != "") {
                  items.add(teController.text);
                }
              });
              teController.clear();
            },
          )
        ],
      ),
    ),
    Divider(
      color: Colors.grey,
      height: 5,
      indent: 10,
      endIndent: 10,
    ),
    Expanded(
      child: ListView.builder(
        itemCount: items.length,
        itemBuilder: (context, index) {
          final item = items[index];
          return Dismissible(
            key: Key(item),
            direction: DismissDirection.startToEnd,
            child: ListTile(
              title: Text(item),
              trailing: IconButton(
                icon: Icon(Icons.delete_forever,color: Colors.red,),
                onPressed: () {
                  setState(() {
                    items.removeAt(index);
                  });
                },
              ),
            ),
            onDismissed: (direction) {
              setState(() {
                items.removeAt(index);
              });
            },
          );
        },
      ),
    ),
  ],
),

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Clickable Card',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ListViewHandelItem(),
    );
  }
}


ListViewHandelItemState pageState;

class ListViewHandelItem extends StatefulWidget {
  @override
  ListViewHandelItemState createState() {
    pageState = ListViewHandelItemState();
    return pageState;
  }
}

class ListViewHandelItemState extends State<ListViewHandelItem> {
  List<String> items = List<String>.generate(7, (index) {
    return "Item - $index";
  });

  final teController = TextEditingController(
    text: "good",
  );

  @override
  void dispose() {
    teController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
          title: Text("Delete ListView Items",
          ),
          backgroundColor: Colors.pink,
      ),
      body: Column(
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Container(
              padding: const EdgeInsets.all(10),
              height: 70,
              alignment: Alignment(0, 0),
              color: Colors.orange,
              child: Text(
                "To remove an item, swipe the tile to the right or tap the trash icon.",
                style: TextStyle(color: Colors.white),
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
            child: Row(
              children: <Widget>[
                Text("Insert Data:"),
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 20),
                    child: TextField(
                      controller: teController,
                      onSubmitted: (text) {
                        setState(() {
                          if (teController.text != "") {
                            items.add(teController.text);
                          }
                        });
                        teController.clear();
                      },
                    ),
                  ),
                ),
                RaisedButton(
                  color: Colors.pink,
                  child: Text("Insert",style: TextStyle(color: Colors.white),),
                  onPressed: () {
                    setState(() {
                      if (teController.text != "") {
                        items.add(teController.text);
                      }
                    });
                    teController.clear();
                  },
                )
              ],
            ),
          ),
          Divider(
            color: Colors.grey,
            height: 5,
            indent: 10,
            endIndent: 10,
          ),
          Expanded(
            child: ListView.builder(
              itemCount: items.length,
              itemBuilder: (context, index) {
                final item = items[index];
                return Dismissible(
                  key: Key(item),
                  direction: DismissDirection.startToEnd,
                  child: ListTile(
                    title: Text(item),
                    trailing: IconButton(
                      icon: Icon(Icons.delete_forever,color: Colors.red,),
                      onPressed: () {
                        setState(() {
                          items.removeAt(index);
                        });
                      },
                    ),
                  ),
                  onDismissed: (direction) {
                    setState(() {
                      items.removeAt(index);
                    });
                  },
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}