Flutter Example - ListView | Handle Items | Change items

 

import 'package:flutter/material.dart';

ListViewHandelItem2State pageState;

class ListViewHandelItem2 extends StatefulWidget {
  @override
  ListViewHandelItem2State createState() {
    pageState = ListViewHandelItem2State();
    return pageState;
  }
}

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

  TextEditingController insertCon = TextEditingController(
    text: "good",
  );
  TextEditingController changeCon = TextEditingController();
  int selectedIndex;

  @override
  void dispose() {
    insertCon.dispose();
    changeCon.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("ListView Handle Items2")),
      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),
              ),
            ),
          ),
          Expanded(
            child: ListView.builder(
              itemCount: items.length,
              itemBuilder: (context, index) {
                final item = items[index];
                return Dismissible(
                  key: Key(item),
                  direction: DismissDirection.startToEnd,
                  child: InkWell(
                    child: ListTile(
                      title: Text(item),
                      trailing: IconButton(
                        icon: Icon(Icons.delete_forever),
                        onPressed: () {
                          setState(() {
                            items.removeAt(index);
                          });
                        },
                      ),
                    ),
                    onTap: () {
                      selectedIndex = index;
                      changeCon.text = items[index];
                    },
                  ),
                  onDismissed: (direction) {
                    setState(() {
                      items.removeAt(index);
                    });
                  },
                );
              },
            ),
          ),
          Divider(
            color: Colors.grey,
            height: 5,
            indent: 10,
            endIndent: 10,
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
            child: Row(
              children: <Widget>[
                Text("Change Item:"),
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 20),
                    child: TextField(
                      controller: changeCon,
                      onSubmitted: (text) {
                        _changeItem();
                      },
                    ),
                  ),
                ),
                RaisedButton(
                  child: Text("Change"),
                  onPressed: () {
                    _changeItem();
                  },
                )
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
            child: Row(
              children: <Widget>[
                Text("Inser Item:"),
                Expanded(
                  child: Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 20),
                    child: TextField(
                      controller: insertCon,
                      onSubmitted: (text) {
                        setState(() {
                          if (insertCon.text != "") {
                            items.add(insertCon.text);
                          }
                        });
                        insertCon.clear();
                      },
                    ),
                  ),
                ),
                RaisedButton(
                  child: Text("Insert"),
                  onPressed: () {
                    setState(() {
                      if (insertCon.text != "") {
                        items.add(insertCon.text);
                      }
                    });
                    insertCon.clear();
                  },
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  void _changeItem() {
    if (selectedIndex == null || changeCon.text.isEmpty) {
      return;
    }
    print("selectedIndex: $selectedIndex, changedText: ${changeCon.text}");
    setState(() {
      items[selectedIndex] = changeCon.text;
    });
    selectedIndex = null;
    changeCon.text = "";

  }
}

 

 

 

▶ Go to Table of Contents | 강의 목차로 이동

---

※ This example is also available in the Flutter Code Examples app. | 본 예제는 Flutter Code Examples 앱에서도 제공됩니다.

Flutter Code Examples - Google Play 앱