接收器代码：
import 'package:flutter/material.dart';
import 'draggable_widget.dart';
class DraggableDemo extends StatefulWidget {
DraggableDemo({Key key}) : super(key: key);
@override
_DraggableDemoState createState() => _DraggableDemoState();
}
class _DraggableDemoState extends State<DraggableDemo> {
Color _draggableColor = Colors.grey;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(//可重叠
children: <Widget>[
DraggableWidget(//发送控件
offset: Offset(80, 80),
widgetColor: Colors.orange,
),
DraggableWidget(
offset: Offset(200, 80),
widgetColor: Colors.red,
),
Center(//拖拽接收器
child: DragTarget(
onAccept: (Color color){//接收条件
_draggableColor = color;
}, builder: (context,candidateData,rejectedData){//固定写法
return Container(//接收控件
width: 200,
height: 200,
color: _draggableColor,
);
},
),
)
],
),
);
}
}
发送器（拖拽器）代码：
import 'package:flutter/material.dart';
class DraggableWidget extends StatefulWidget {
final Offset offset;
final Color widgetColor;
const DraggableWidget({Key key,this.offset,this.widgetColor}):super(key:key);
@override
_DraggableWidgetState createState() => _DraggableWidgetState();
}
class _DraggableWidgetState extends State<DraggableWidget> {
Offset offset = Offset(0.0, 0.0);
@override
void initState() {
super.initState();
offset = widget.offset;//取传进来的offset
}
@override
Widget build(BuildContext context) {
return Positioned(
left: offset.dx,
top: offset.dy,
child: Draggable(//可拖动的组件
data: widget.widgetColor,//传递xxx给接收器 xxx此处为颜色 此处要和接收器的onAccept 相对应
child: Container(
width: 100.0,
height: 100.0,
color: widget.widgetColor,//传递过来的颜色
),
feedback: Container(
width: 120,
height: 120,
color: widget.widgetColor.withOpacity(0.5),//半透明
),//当拖动的时候的样式
onDraggableCanceled: (Velocity velocity,Offset offset){
setState(() {
this.offset = offset;//拖动结束
});
},//拖拽完成
),
);
}
}
总结：
//拖拽控件
Draggable（
data:xxx //传递的数据 和 DragTarget 中的onAccept 相呼应
feedback：（） 拖拽时的样式
onDraggableCanceled ：（）拖拽结束的样式
）
DragTarget(
onAccept:(xxx){//拖拽接受条件
}，builder:(context,candidateData,rejectedData){
xxx //接受控件
}
)