I am trying to pass a class inside the Stack to the ListView, but it does not display on the screen as it should and gives an error
Restarted application in 1 071ms.
════════ Exception caught by widgets library ═══════════════════════════════════ The following assertion was thrown while applying parent data.: Incorrect use of ParentDataWidget.
The ParentDataWidget Positioned(left: 154.0, top: 21.0, width: 73.0, height: 366.0) wants to apply ParentData of type StackParentData to a RenderObject, which has been set up to accept ParentData of incompatible type ParentData.
Usually, this means that the Positioned widget has the wrong ancestor RenderObjectWidget. Typically, Positioned widgets are placed directly inside Stack widgets. The offending Positioned is currently placed inside a RepaintBoundary widget.
The ownership chain for the RenderObject that received the incompatible parent data was: SizedBox ← Positioned ← MyRandomizedButton-[<'0'>] ← RepaintBoundary ← IndexedSemantics ← NotificationListener ← KeepAlive ← AutomaticKeepAlive ← KeyedSubtree-[Key <[<'0'>]>] ← SliverList ← ⋯ When the exception was thrown, this was the stack
#0 RenderObjectElement._updateParentData. #1 RenderObjectElement._updateParentData #2 RenderObjectElement.attachRenderObject #3 RenderObjectElement.mount #4 SingleChildRenderObjectElement.mount ... Normal element mounting (47 frames) #51 Element.inflateWidget #52 Element.updateChild #53 SliverMultiBoxAdaptorElement.updateChild #54 SliverMultiBoxAdaptorElement.createChild. #55 BuildOwner.buildScope #56 SliverMultiBoxAdaptorElement.createChild #57 RenderSliverMultiBoxAdaptor._createOrObtainChild. #58 RenderObject.invokeLayoutCallback. #59 PipelineOwner._enableMutationsToDirtySubtrees #60 RenderObject.invokeLayoutCallback #61 RenderSliverMultiBoxAdaptor._createOrObtainChild #62 RenderSliverMultiBoxAdaptor.addInitialChild #63 RenderSliverList.performLayout #64 RenderObject.layout #65 RenderSliverEdgeInsetsPadding.performLayout #66 RenderSliverPadding.performLayout #67 RenderObject.layout #68 RenderViewportBase.layoutChildSequence #69 RenderViewport._attemptLayout #70 RenderViewport.performLayout #71 RenderObject.layout #72 RenderProxyBoxMixin.performLayout #73 RenderObject.layout #74 RenderProxyBoxMixin.performLayout #75 RenderObject.layout #76 RenderProxyBoxMixin.performLayout #77 RenderObject.layout #78 RenderProxyBoxMixin.performLayout #79 RenderObject.layout #80 RenderProxyBoxMixin.performLayout #81 RenderObject.layout #82 RenderProxyBoxMixin.performLayout #83 RenderObject.layout #84 RenderProxyBoxMixin.performLayout #85 RenderObject.layout #86 RenderProxyBoxMixin.performLayout #87 RenderCustomPaint.performLayout #88 RenderObject.layout #89 RenderProxyBoxMixin.performLayout #90 RenderObject.layout #91 ChildLayoutHelper.layoutChild #92 RenderStack._computeSize #93 RenderStack.performLayout #94 RenderObject.layout #95 MultiChildLayoutDelegate.layoutChild #96 _ScaffoldLayout.performLayout #97 MultiChildLayoutDelegate._callPerformLayout #98 RenderCustomMultiChildLayoutBox.performLayout #99 RenderObject.layout #100 RenderProxyBoxMixin.performLayout #101 RenderObject.layout #102 RenderProxyBoxMixin.performLayout #103 _RenderCustomClip.performLayout #104 RenderObject.layout #105 MultiChildLayoutDelegate.layoutChild #106 _ScaffoldLayout.performLayout #107 MultiChildLayoutDelegate._callPerformLayout #108 RenderCustomMultiChildLayoutBox.performLayout #109 RenderObject.layout #110 RenderProxyBoxMixin.performLayout #111 RenderObject.layout #112 RenderProxyBoxMixin.performLayout #113 _RenderCustomClip.performLayout #114 RenderObject.layout #115 RenderProxyBoxMixin.performLayout #116 RenderObject.layout #117 RenderProxyBoxMixin.performLayout #118 RenderObject.layout #119 RenderProxyBoxMixin.performLayout #120 RenderObject.layout #121 RenderProxyBoxMixin.performLayout #122 RenderObject.layout #123 RenderProxyBoxMixin.performLayout #124 RenderObject.layout #125 RenderProxyBoxMixin.performLayout #126 RenderObject.layout #127 RenderProxyBoxMixin.performLayout #128 RenderObject.layout #129 RenderProxyBoxMixin.performLayout #130 RenderObject.layout #131 RenderProxyBoxMixin.performLayout #132 RenderObject.layout #133 RenderProxyBoxMixin.performLayout #134 RenderObject.layout #135 RenderProxyBoxMixin.performLayout #136 RenderObject.layout #137 RenderProxyBoxMixin.performLayout #138 RenderObject.layout #139 RenderProxyBoxMixin.performLayout #140 RenderObject.layout #141 RenderProxyBoxMixin.performLayout #142 RenderObject.layout #143 RenderProxyBoxMixin.performLayout #144 RenderObject.layout #145 RenderProxyBoxMixin.performLayout #146 RenderObject.layout #147 RenderProxyBoxMixin.performLayout #148 RenderOffstage.performLayout #149 RenderObject.layout #150 RenderProxyBoxMixin.performLayout #151 RenderObject.layout #152 _RenderTheatre.performLayout #153 RenderObject.layout #154 RenderProxyBoxMixin.performLayout #155 RenderObject.layout #156 RenderProxyBoxMixin.performLayout #157 RenderObject.layout #158 RenderProxyBoxMixin.performLayout #159 RenderObject.layout #160 RenderProxyBoxMixin.performLayout #161 RenderCustomPaint.performLayout #162 RenderObject.layout #163 RenderProxyBoxMixin.performLayout #164 RenderObject.layout #165 RenderProxyBoxMixin.performLayout #166 RenderObject.layout #167 RenderProxyBoxMixin.performLayout #168 RenderObject.layout #169 RenderProxyBoxMixin.performLayout #170 RenderObject.layout #171 RenderView.performLayout #172 RenderObject._layoutWithoutResize #173 PipelineOwner.flushLayout #174 RendererBinding.drawFrame #175 WidgetsBinding.drawFrame #176 RendererBinding._handlePersistentFrameCallback #177 SchedulerBinding._invokeFrameCallback #178 SchedulerBinding.handleDrawFrame #179 SchedulerBinding.scheduleWarmUpFrame. (elided 11 frames from class _RawReceivePortImpl, class _Timer, dart:async, and dart:async-patch) ════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by widgets library ═══════════════════════════════════ Incorrect use of ParentDataWidget. ════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by widgets library ═══════════════════════════════════ Incorrect use of ParentDataWidget. ════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by widgets library ═══════════════════════════════════ Incorrect use of ParentDataWidget. ════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by widgets library ═══════════════════════════════════ Incorrect use of ParentDataWidget. ════════════════════════════════════════════════════════════════════════════════
in the console. When I just pass the class inside the Stack by manually changing the Key, everything works as it should. How can I fix this?
The widget that gives an error:
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'dart:io';
import 'list_parametrs_widget.dart';
import 'main_screen_widget.dart';
class MainScreenWidget extends StatefulWidget {
const MainScreenWidget({Key? key}) : super(key: key);
@override
State<MainScreenWidget> createState() => _MainScreenWidgetState();
}
class _MainScreenWidgetState extends State<MainScreenWidget> {
@override
Widget build(BuildContext context) {
SystemChrome.setEnabledSystemUIOverlays([]);
return Scaffold(
body: Stack(
children: [
ListView.builder(
itemCount: 5,
itemBuilder: (context, index) {
return MyRandomizedButton(key: ValueKey(index.toString()));
})
// MyRandomizedButton(key: ValueKey("0")),
],
),
);
}
}
class MyRandomizedButton extends StatefulWidget {
const MyRandomizedButton({
Key? key,
}) : super(key: key);
static Set<Color> _getColorSet({int numberOfColor = 3}) {
final generatedColorSet = <Color>{};
while (generatedColorSet.length != numberOfColor) {
generatedColorSet.add(
Colors.primaries[Random().nextInt(Colors.primaries.length)],
);
}
return generatedColorSet;
}
@override
State<MyRandomizedButton> createState() => _MyRandomizedButtonState();
}
class _MyRandomizedButtonState extends State<MyRandomizedButton> {
@override
Widget build(BuildContext context) {
final maxWidth = MediaQuery.of(context).size.width;
final maxHeight = MediaQuery.of(context).size.height;
final random = Random();
int minT = 3;
int maxT = maxHeight.toInt() - 80;
int randomTop = minT random.nextInt(maxT - minT);
int minL = 3;
int maxL = maxWidth.toInt() - 80;
int randomLeft = minL random.nextInt(maxL - minL);
int minH = 70;
int maxH = maxHeight.toInt() - randomTop;
int randomHeight = minH random.nextInt(maxH - minH);
int minW = 70;
int maxW = maxWidth.toInt() - randomLeft;
int randomWidth = minW random.nextInt(maxW - minW);
int minR = 1;
int maxR = 75;
int randomRadius = minR random.nextInt(maxR - minR);
final colorSet = MyRandomizedButton._getColorSet();
return Positioned(
height: randomHeight.toDouble(),
width: randomWidth.toDouble(),
top: randomTop.toDouble(),
left: randomLeft.toDouble(),
child: SizedBox(
child: ElevatedButton(
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(colorSet.elementAt(0)),
overlayColor: MaterialStateProperty.all(colorSet.elementAt(1)),
shape: MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(randomRadius.toDouble()),
side: BorderSide(color: colorSet.elementAt(2), width: 5),
),
),
padding: MaterialStateProperty.all(const EdgeInsets.all(10)),
minimumSize: MaterialStateProperty.all(const Size(70, 70)),
),
onPressed: () {
setState(() {});
},
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
'PRESS',
style: TextStyle(color: Colors.white, fontSize: maxWidth),
),
),
),
),
);
}
}
CodePudding user response：
As mentioned in the docs
A Positioned widget must be a descendant of a Stack.
Please Wrap your Positioned widget inside a stack
Stack(
children: [
Positioned(
/// remaining code
]
)
CodePudding user response：
Please update the MyRandomizedButton code and the complete error you are getting in your console.
You are using a positioned widget as the parent of the sized box which is creating an issue. The positioned widget can only be used inside a stack. So you can try to update your listview.builder inside a positioned widget instead of a sized box. Here is an example code. Let me know if this works for you.
class MainScreenWidget extends StatefulWidget {
const MainScreenWidget({Key? key}) : super(key: key);
@override
State<MainScreenWidget> createState() => _MainScreenWidgetState();
}
class _MainScreenWidgetState extends State<MainScreenWidget> {
@override
Widget build(BuildContext context) {
final maxWidth = MediaQuery.of(context).size.width;
final maxHeight = MediaQuery.of(context).size.height;
final random = Random();
int minT = 3;
int maxT = maxHeight.toInt() - 80;
int randomTop = minT random.nextInt(maxT - minT);
int minL = 3;
int maxL = maxWidth.toInt() - 80;
int randomLeft = minL random.nextInt(maxL - minL);
int minH = 70;
int maxH = maxHeight.toInt() - randomTop;
int randomHeight = minH random.nextInt(maxH - minH);
int minW = 70;
int maxW = maxWidth.toInt() - randomLeft;
int randomWidth = minW random.nextInt(maxW - minW);
int minR = 1;
int maxR = 75;
int randomRadius = minR random.nextInt(maxR - minR);
SystemChrome.setEnabledSystemUIOverlays([]);
return Scaffold(
body: Stack(
children: [
Positioned(
height: randomHeight.toDouble(),
width: randomWidth.toDouble(),
top: randomTop.toDouble(),
left: randomLeft.toDouble(),
child: ListView.builder(
itemCount: 5,
itemBuilder: (context, index) {
return MyRandomizedButton(key: ValueKey(index.toString()));
}),
)
// MyRandomizedButton(key: ValueKey("0")),
],
),
);
}
}