как я могу удалить элемент из этого конструктора listview после перетаскивания в цель darg

#flutter #listview #drag-and-drop #dragtarget

Вопрос:

я новичок в dart, я пытался создать игру с глаголами с перетаскиванием, я создал модель, затем перетаскиваемый виджет и цель перетаскивания, затем я создаю представление списка с данными, которые я вытолкнул из основного, но проблема в том, что я не нашел, как удалить виджет из списка после его перетаскивания в нужное место, я ооочень стек, поэтому, пожалуйста, если кто-нибудь может мне помочь, я буду благодарен

это класс

 import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:templates/Model/equation.model.dart'; import 'package:confetti/confetti.dart';  class Equations extends StatefulWidget {   final Equation equation;  Equations(this.equation);  @override  _EquationsState createState() =gt; _EquationsState(); }  ConfettiController confettiController =  ConfettiController(duration: Duration(seconds: 2));   class _EquationsState extends Statelt;Equationsgt; {   bool showIcons = false;  Listlt;Stringgt; responses = [];  bool checkResults() {  bool result = true;   for (int i = 0; i lt; responses.length; i  ) {  if (widget.equation.props[i].result.toString() != responses[i]) {  result = false;  }  }  return result; } @override  void initState() {  // TODO: implement initState  super.initState();  responses = List.filled(widget.equation.props.length, "");  }   @override  Widget build(BuildContext context) {  return SafeArea(  child: Scaffold(  backgroundColor: Colors.grey[300],  body: Container(  height: MediaQuery.of(context).size.height,  width: MediaQuery.of(context).size.width,  decoration: BoxDecoration(  image: DecorationImage(  image: AssetImage('assets/images/bg.png'),  fit: BoxFit.cover)),  child: SingleChildScrollView(  child: Stack(  children: [  Align(  alignment: Alignment.center,  child: ConfettiWidget(  confettiController: confettiController,  colors: [  Colors.red,  Colors.blue,  Colors.green,  Colors.yellow,  Colors.purple,  Colors.pink,  Colors.brown  ],  shouldLoop: true,  numberOfParticles: 28,  emissionFrequency: 0.07,  blastDirectionality: BlastDirectionality.explosive,  gravity: 0.1,  minBlastForce: 12,  maxBlastForce: 16,  ),  ),  Column(  children: [  SizedBox(  height: 10,  ),  FittedBox(  child: Text(  widget.equation.question,  style: TextStyle(fontSize: 24),  ),  fit: BoxFit.scaleDown,  ),  SizedBox(  height: 10,  ),  ListView.builder(  shrinkWrap: true,  physics: NeverScrollableScrollPhysics(),  itemCount: widget.equation.props.length,  itemBuilder: (context, index) {  return Padding(  padding: const EdgeInsets.all(10.0),  child: Container(  decoration: BoxDecoration(  color: Colors.white,  border: Border.all(  color: Colors.blueAccent, width: 4),  borderRadius: BorderRadius.circular(10),  ),  child: Padding(  padding: const EdgeInsets.all(8.0),  child: Row(  children: [  FittedBox(  child: Text(  widget.equation.props[index].fields,  style: TextStyle(fontSize: 18),  ),  fit: BoxFit.scaleDown,  ),  Spacer(),  Container(  width: 50,  child: TextField(  keyboardType: TextInputType.number,  onChanged: (value) {  String removeSpace =  value.replaceAll(" ", "");  String replaceVirgule = removeSpace  .replaceAll(",", ".");  responses[index] = replaceVirgule;  print("before :"   value);  print("after :"   replaceVirgule);  },  ),  ),  SizedBox(  width: 10,  ),  Icon(  showIcons  ? widget.equation.props[index].result.toString() ==  responses[index]  ? Icons.verified  : Icons.error  : null,  color: widget.equation.props[index].result.toString() ==  responses[index]  ? Colors.green  : Colors.red,  )  ],  ),  ),  ),  );  }),  SizedBox(  height: 10,  ),  Container(  width: MediaQuery.of(context).size.width * 0.7,  child: ElevatedButton(  onPressed: () {  if (checkResults()) {  confettiController.play();  Future.delayed(const Duration(seconds: 5), () {  confettiController.stop();  });  }  setState(() {  showIcons = true;  });  },  child: Text(  'الإجابة',  style: TextStyle(fontSize: 20),  )),  )  ],  ),  ],  )),  )));  } }    

это виджеты цели перетаскивания и перетаскиваемой

 import 'package:flutter/material.dart'; import 'package:templates/Model/verbe.model.dart';  class DragWidget extends StatelessWidget {  final String title_data; //dragoble  final String title_drag;  final Color colors_d;  //feedback  final String title_fb;  final Color colors_fb; //childwhen it is darged  final String title_child;  final Color colors_child;   DragWidget(  {Key? key,  required this.title_data,  required this.title_child,  required this.title_drag,  required this.title_fb,  required this.colors_child,  required this.colors_d,  required this.colors_fb})  : super(key: key);   @override  Widget build(BuildContext context) {  return Draggablelt;Stringgt;(  // Data is the value this Draggable stores.  data: title_data,  child: Container(  decoration: BoxDecoration(  borderRadius: BorderRadius.circular(15), // radius of 10  color: colors_d, // green as background color  ),  height: 100,  width: 100.0,  // color: colors_d,  child: Center(  child: Text(  title_drag,  textScaleFactor: 2,  ),  ),  ),  feedback: Material(  child: Container(  height: 50.0,  width: 100.0,  decoration: BoxDecoration(  borderRadius: BorderRadius.circular(15), // radius of 10  color: colors_fb,  ),  child: Center(  child: Text(  title_fb,  textScaleFactor: 2,  ),  ),  ),  ),  childWhenDragging: Container(  height: 50.0,  width: 100.0,  decoration: BoxDecoration(  borderRadius: BorderRadius.circular(15), // radius of 10  color: colors_child, // green as background color  ),  child: Center(  child: Text(  title_child,  textScaleFactor: 2,  ),  ),  ),  );  } }  class DargTarget1 extends StatefulWidget {  bool isDroped;  String title_data;  String part1;  String part2;  String prop;  DargTarget1({  Key? key,  required this.title_data,  required this.prop,  required this.part1,  required this.part2,  required this.isDroped,  });   @override  Statelt;DargTarget1gt; createState() =gt; _DargTarget1State(); }  class _DargTarget1State extends Statelt;DargTarget1gt; {  @override  Widget build(BuildContext context) {  return Container(  child: Column(  children: [  DragTargetlt;Stringgt;(  builder: (  BuildContext context,  Listlt;dynamicgt; accepted,  Listlt;dynamicgt; rejected,  ) {  return Row(  mainAxisAlignment: MainAxisAlignment.center,  children: [  Text(  widget.part1,  style: TextStyle(fontSize: 18, color: Colors.black),  ),  SizedBox(  width: 10,  ),  DottedBorder(  borderType: BorderType.RRect,  radius: Radius.circular(12),  padding: EdgeInsets.all(6),  color: Colors.black,  strokeWidth: 2,  dashPattern: [6],  child: ClipRRect(  borderRadius: BorderRadius.all(Radius.circular(12)),  child: Container(  height: 30,  width: 60,  color: widget.isDroped ? Colors.green : null,  child: Center(  child: Text(  !widget.isDroped ? '......' : widget.prop,  style: TextStyle(  color: Colors.black, fontSize: 25))),  ),  ),  ),  SizedBox(  width: 10,  ),  Text(  widget.part2,  style: TextStyle(fontSize: 18, color: Colors.black),  ),  SizedBox(  width: 10,  ),  ],  );  },  onAccept: (data) {  setState(() {  showSnackBarGlobal(context, 'أحسنت');  widget.isDroped = true;  });  },  onWillAccept: (data) {  return data == widget.title_data;  },  onLeave: (data) {  showSnackBarGlobal(context, 'خطأ');  },  ),  ],  ),  );  }   void showSnackBarGlobal(BuildContext context, String message) {  ScaffoldMessenger.of(context).removeCurrentSnackBar();  ScaffoldMessenger.of(context).showSnackBar(SnackBar(  content: Text(  message,  textScaleFactor: 2,  )));  } } //this function remove data from the list  

это модель, с которой я работаю

 Listlt;Verbegt; verbe;  Verbes(this.verbe); }  class Verbe {  String part1;  String part2;   bool isDropped;  String data_test0;  String prop;  Verbe(this.isDropped, this.data_test0, this.prop, this.part1, this.part2); }  

и это данные, которые я отправляю из главного

 Listlt;Verbegt; itemsVerbess = [  Verbe(false, 'a', 'ferai', "je", ""),  Verbe(false, 'b', 'feras', "tu", ""),  Verbe(false, 'c', 'fera', "il", ""),  Verbe(false, 'd', 'ferons', "nous", ""),  Verbe(false, 'e', 'ferez', "vous", ""),  Verbe(false, 'f', 'feront', "ils", "")  ];  

Ответ №1:

Если я правильно понимаю, я вижу решение следующим образом:

  1. Создайте флаг isDraggedToTarget = false;
  2. Когда он перетаскивается, вызовите setState и установите флаг в значение true
  3. В разделе виджет в ListView напишите такое условие:

    если(isDraggedToTarget!=верно)

    Контейнер(),

Поэтому, когда флаг ложен, вы увидите виджет, и он исчезнет, если флаг верен

Комментарии:

1. нет необходимости добавлять новый флаг, потому что у меня есть widget.verbess.verbe[индекс].Сбрасывается изменение состояния каждый раз, когда я попадаю в цель

2. или я не понял, что ты имеешь в виду