一个拖拽的目标区域，可接收Draggable组件的信息。可以获取拖拽时的回调。

相关组件

Draggable LongPressDraggable

DragTarget基本操作

【builder】:组件构造器【DragTargetBuilder】
【onWillAccept】：拖入时【Function(T)】
【onAccept】：拖入成功【Function(T)】
【onLeave】：拖入再拖出【Function(T)】
106.gif

  1. import 'package:flutter/material.dart';
  2. class CustomDragTarget extends StatefulWidget {
  3.   @override
  4.   _CustomDragTargetState createState() => _CustomDragTargetState();
  5. }
  7. class _CustomDragTargetState extends State<CustomDragTarget> {
  8.   Color _color = Colors.grey;
  9.   String _info = 'DragTarget';
  11.   @override
  12.   Widget build(BuildContext context) {
  13.     return Container(
  14.       child: Column(
  15.         children: <Widget>[
  16.           Wrap(
  17.             children: _buildColors(),
  18.             spacing: 10,
  19.           ),
  20.           SizedBox(height: 20,),
  21.           _buildDragTarget()
  22.         ],
  23.       ),
  24.     );
  25.   }
  27.   List<Widget> _buildColors() {
  28.     var colors = [
  29.       Colors.red,
  30.       Colors.yellow,
  31.       Colors.blue,
  32.       Colors.green,
  33.       Colors.orange,
  34.       Colors.purple,
  35.       Colors.cyanAccent
  36.     ];
  37.     return colors
  38.         .map(
  39.           (e) => Draggable<Color>(
  40.           child: Container(
  41.             width: 30,
  42.             height: 30,
  43.             alignment: Alignment.center,
  44.             child: Text(
  45.               colors.indexOf(e).toString(),
  46.               style: TextStyle(
  47.                   color: Colors.white, fontWeight: FontWeight.bold),
  48.             ),
  49.             decoration: BoxDecoration(color: e, shape: BoxShape.circle),
  50.           ),
  51.           data: e,
  52.           feedback: Container(
  53.             width: 25,
  54.             height: 25,
  55.             decoration: BoxDecoration(color: e, shape: BoxShape.circle),
  56.           )),
  57.     )
  58.         .toList();
  59.   }
  61.   Widget _buildDragTarget() {
  62.     return DragTarget<Color>(
  63.         onLeave: (data) => setState(() => _info='onLeave'),
  64.         onAccept: (data) => setState(() {
  65.             _info='onAccept';
  66.             _color = data;
  67.           }),
  68.         onWillAccept: (data) {
  69.           setState(() {
  70.             _info='onWillAccept';
  71.           });
  72.           print("onWillAccept: data = $data ");
  73.           return data != null;
  74.         },
  75.         builder: (context, candidateData, rejectedData) => Container(
  76.             width: 150.0,
  77.             height: 50.0,
  78.             color: _color,
  79.             child: Center(
  80.               child: Text(
  81.                 _info,
  82.                 style: TextStyle(color: Colors.white),
  83.               ),
  84.             )));
  85.   }
  86. }