如何动态更改小部件类型?

Question

我想改变小部件类型一会儿，它不工作，我无法解决这个问题。我的假设是，当我点击小部件时，它应该是可拖拽的，它应该是拖拽目标，而我没有点击。

Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
dragStartBehavior: DragStartBehavior.start,
onVerticalDragStart: (d) {
c.index.value = 1;
},
onVerticalDragUpdate: (d) {
c.index.value = 1;
},
onVerticalDragEnd: (d) {
c.index.value = 0;
},
child: Obx(
() => IndexedStack(
index: c.index.value,
children: [
DragTarget(
onAccept: (data) {
print(data);
},
builder: (context, candidateData, rejectedData) =>
Container(
width: 40,
height: 40,
color: Colors.grey,
)
),
Draggable(
data: "data",
childWhenDragging: Container(
width: 40,
height: 40,
color: Colors.white,
),
child: Container(
width: 40,
height: 40,
color: Colors.amber,
),
feedback: Container(
width: 40,
height: 40,
color: Colors.blue,
)
),
],
),
))
],
)

Answer 1

可以使用条件语句。在你们更新的代码中，Obx包含条件语句。如果c.index.value为0，则返回DragTarget小部件，如果为1，则返回Draggable小部件:

Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
dragStartBehavior: DragStartBehavior.start,
onVerticalDragStart: (d) {
c.index.value = 1;
},
onVerticalDragUpdate: (d) {
c.index.value = 1;
},
onVerticalDragEnd: (d) {
c.index.value = 0;
},
child: Obx(
() {
if (c.index.value == 0) {
return DragTarget(
onAccept: (data) {
print(data);
},
builder: (context, candidateData, rejectedData) => Container(
width: 40,
height: 40,
color: Colors.grey,
),
);
} else {
return Draggable(
data: "data",
childWhenDragging: Container(
width: 40,
height: 40,
color: Colors.white,
),
child: Container(
width: 40,
height: 40,
color: Colors.amber,
),
feedback: Container(
width: 40,
height: 40,
color: Colors.blue,
),
);
}
},
),
),
],
),

快乐编码…