我无法避免“不正确使用 ParentDataWidget”错误。下面的代码有效 - 我希望能够将可拖动小部件放到 bottomSheet 中的 dragTarget 上,但也希望小部件可在主体中拖动。
该代码在模拟器中运行良好,但是当 dragTarget 接受了 draggable 时,错误会在控制台中标记出来。
有什么明显的我做错了吗?
void main() => runApp(MyApp());
bool isAccepted = false;
DragMe niceBox = new DragMe('Hello', 50.0, 100.0, Colors.green);
DragMe nastyBox = new DragMe('Yucky', 150.0, 100.0, Colors.brown[300]);
TargetBox targetBox = new TargetBox();
MyDragTarget myDragTarget = new MyDragTarget();
const kTopSpace = 96; // Height of Appbar plus the icon bar above
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData( fontFamily: 'PressStart'),
home: MyHomeScreen(),
);
}
}
class MyHomeScreen extends StatefulWidget {
MyHomeScreen({Key key}) : super(key: key);
createState() => MyHomeScreenState();
}
class MyHomeScreenState extends State<MyHomeScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.red[100],
appBar: AppBar(
toolbarHeight: 70.0,
title: Center(child: Text('My brain hurts')),
backgroundColor: Colors.pink,
),
body: Stack(children: [niceBox, nastyBox]),
bottomSheet: Container(
color: Colors.lightBlue,
height: 100.0,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
children: [myDragTarget],
),
),
);
} // End build()
} // End class MyHomeScreenState
class DragMe extends StatefulWidget {
DragMe(this.myText, this.xPos, this.yPos, this.myColor);
final String myText;
double xPos;
double yPos;
final Color myColor;
@override
_DragMeState createState() => _DragMeState();
}
class _DragMeState extends State<DragMe> {
@override
Widget build(BuildContext context) {
return Positioned(
left: widget.xPos,
top: widget.yPos,
// left: widget.xPos,
// top: widget.yPos,
child: Draggable(
data: widget.myText,
feedback: Container(height: 50, width: 70, color: Colors.grey),
childWhenDragging: Container(),
onDragStarted: () {},
onDragEnd: (details) {
setState(() {
widget.xPos = details.offset.dx;
widget.yPos = details.offset.dy - kTopSpace;
});
},
onDragCompleted: () {},
onDraggableCanceled: (velocity, offset) {},
child: Container(
child: Center(child: Text(widget.myText)),
color: widget.myColor,
height: 50,
width: 70,
),
),
);
}
}
class MyDragTarget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return DragTarget<String>(
builder: (context, List<String> acceptedData, rejectedData) {
if (isAccepted) {
return niceBox;
} else {
return targetBox;
}
},
onWillAccept: (data) {
if (data == 'Hello') {
isAccepted = true;
return true;
} else {
isAccepted = false;
return false;
}
},
onAccept: (strData) {},
onLeave: (strData) {
return true;
},
onMove: (moveData) {
return true;
},
onAcceptWithDetails: (data) {},
);
}
}
class TargetBox extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
child: Center(child: Text('Drop Here')),
color: Colors.yellow,
height: 50.0,
width: 100.0);
}
}
答案 0 :(得分:0)
您的堆栈没有任何可以保持的最大界限。您想要做的是将 Stack
包装成具有您选择的宽度和高度的 SizedBox
或 Container
。如果您希望它占用所有可用空间,请这样做:
SizedBox(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
child: Stack(),
)
答案 1 :(得分:0)
根据 docs,Positioned
小部件必须是 Stack
的直接后代
Positioned 小部件必须是 Stack 的后代,并且从 Positioned 小部件到其封闭 Stack 的路径必须仅包含 StatelessWidgets 或 StatefulWidgets(而不是其他类型的小部件,如 RenderObjectWidgets)。
由于您有 Stack > DragMe > Positioned
,它会因该错误而失败。
你需要有
Stack(children: [
Positioned(...),
])