Я хочу удалить выбранные данные из списка с помощью кнопки удаления на панели действий

I'm new to flutter and I want to delete the selected values from the list,but I don't know how to delete selected Items,can anyone help?

I have taken icon button in Appbar and I tried to setState in it by using the .removelast() command,but I want to select the Item then delete it.

Код :

class DemoPage extends State<MyHomePage> {
  TextEditingController Controller = TextEditingController();
  List<String> msg = List();



  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return Scaffold(
      appBar: AppBar(
        title: Text('Demo_App'),
        actions: <Widget>[
          IconButton(icon: Icon(Icons.delete),
              onPressed: (){
                  setState(() {
                    msg.removeLast();
                  });
              }),
        ],
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          Container(
            alignment: Alignment.topLeft,
            margin: EdgeInsets.only(right: 150.0,top: 10.0,left: 8.0),
            child:TextField(
                controller: Controller,
                decoration: InputDecoration(
                  border: OutlineInputBorder(),
                  hintText: 'please enter your name',
                ),
              ),

          ),
          Container(
            alignment: Alignment.topRight,
            margin: EdgeInsets.only(left: 250.0,right: 10.0),
            child: RaisedButton(
              onPressed: () {
                setState(() {
                  msg.add(Controller.text);
                  Controller.clear();
                });
              },
              child: Text('Add'),
            ),
          ),
          Expanded(
            flex: 2,
              child: Container(
                child: Card(
                  margin: EdgeInsets.all(8.0),
                  child: ListView.builder(
                    itemCount: msg.length,
                    itemBuilder: (context, index){
                      if (index.isInfinite){
                        return Divider();
                      }
                      return ListTile(
                        title: Text(msg[index]),
                      );
                    },),
                ),
              )),
        ],
      ),
    );
  }

}

I want to select the data and then delete it using the icon Button in the AppBar.

Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
0
1 272
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Предположим, вы хотите выбрать элементы одним щелчком мыши.

Возьмите отдельный список indexList, и каждый раз, когда вы выбираете элемент, вы сохраняете щелкнутый индекс в indexList.

Затем, нажав кнопку «Удалить», запустите цикл на indexList и удалите элементы из itemList, используя сохраненные индексы.

чистый indexList обновить свое состояние

class DemoPage extends State<MyHomePage> {
  TextEditingController Controller = TextEditingController();
  List<String> msg = List();
  List<int> selectedItems = List();

  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return Scaffold(
      appBar: AppBar(
        title: Text('Demo_App'),

    actions: <Widget>[
      IconButton(
          icon: Icon(Icons.delete),
          onPressed: () {
            setState(() {
              msg.removeLast();
            });
          }),
    ],
  ),
  body: Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      Container(
        alignment: Alignment.topLeft,
        margin: EdgeInsets.only(right: 150.0, top: 10.0, left: 8.0),
        child: TextField(
          controller: Controller,
          decoration: InputDecoration(
            border: OutlineInputBorder(),
            hintText: 'please enter your name',
          ),
        ),
      ),
      Container(
        alignment: Alignment.topRight,
        margin: EdgeInsets.only(left: 250.0, right: 10.0),
        child: RaisedButton(
          onPressed: () {
            setState(() {
              msg.add(Controller.text);
              Controller.clear();
            });
          },
          child: Text('Add'),
        ),
      ),
      Expanded(
          flex: 2,
          child: Container(
            child: Card(
              margin: EdgeInsets.all(8.0),
              child: ListView.builder(
                  itemCount: msg.length,
                  itemBuilder: (context, index) {
                    return new GestureDetector(
                        onLongPress: () {
                          if (selectedItems.contains(index))
                            selectedItems.remove(index);
                          else
                            selectedItems.add(index);
                        },
                        onTap: () {
                          if (selectedItems.contains(index))
                            selectedItems.remove(index);
                          else
                            selectedItems.add(index);
                        },
                        child: index.isInfinite
                            ? Divider()
                            : ListTile(
                                title: Text(msg[index]),
                              ));
                  }),
            ),
          )),
    ],
  ),
);
  }

  void _deleteItems(){ // call _deleteItems() on clicking delete button

    setState(() {
      //set your state
      for (final index in selectedItems)
          msg.removeAt(index);
      selectedItems.clear();
    });
  }

}

Спасибо за решение, оно сработало, но если я долго нажимаю, чтобы выбрать ввод данных в списке, я хочу удалить его с помощью кнопки, как я могу применить его с помощью Gesuredetector.

user10820116 27.05.2019 10:56

@AshishMore Я добавил onLongPress: (){ } проверить обновленный ответ

shb 27.05.2019 11:03

Спасибо, все работает нормально, но я не вижу, выбран ли элемент в longPress, я пытался изменить цвет выбранного элемента после нажатия на него, но это не работает, есть предложения, как это сделать.

user10820116 27.05.2019 11:34

Вам нужно изменить свойство стиля текста. в этом случае модель данных будет работать лучше. Это совсем другой вопрос т.

shb 27.05.2019 11:38

ооо .. спасибо за ваш ответ .. действительно ценю это .. :)

user10820116 27.05.2019 11:41

Другие вопросы по теме