Victor Otubure
Reputation: 3
DiagnosticsProperty<BoxConstraints>
Please I am having this error in my flutter code. Below is my code:
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.black,
leading: IconButton(
onPressed: () {
Navigator.of(context).pop();
},
icon: const Icon(Icons.arrow_back_ios)),
title: const Text('Categories'),
),
body: Container(
color: Colors.black,
height: double.infinity,
width: double.infinity,
transformAlignment: Alignment.center,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
child: ListView(
shrinkWrap: true,
physics: const BouncingScrollPhysics(),
children: [
ListTile(
title: const Text(
"Option1",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option2",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option3",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option4",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
],
),
),
Container(
color: Colors.white,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
children: [
GestureDetector(
onTap: () {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('pick color'),
content: SingleChildScrollView(
child: ColorPicker(
pickerColor: pickerColor,
onColorChanged: changeColor,
)),
actions: [
ElevatedButton(
child: const Text("You gerrit now"),
onPressed: () {
setState(() =>
currentColor = pickerColor);
Navigator.of(context).pop();
},
)
],
));
},
),
const Text(
"colorpicker",
),
const Text("stuff",
style: TextStyle(
color: Colors.white,
backgroundColor: Colors.green)),
],
),
],
),
)
],
),
));
Also, below is the error in my debug console pointing at the point of code flaw:
if (!constraints.hasBoundedHeight) {
RenderBox node = this;
while (
!node.constraints.hasBoundedHeight && node.parent is RenderBox) {
node = node.parent! as RenderBox;
}
information.add(node.describeForError(
'The nearest ancestor providing an unbounded height constraint is'));
}
throw FlutterError.fromParts(<DiagnosticsNode>[
...information,
DiagnosticsProperty<BoxConstraints>(
'The constraints that applied to the $runtimeType were',
constraints,
style: DiagnosticsTreeStyle.errorProperty),
DiagnosticsProperty<Size>('The exact size it was given was', _size,
style: DiagnosticsTreeStyle.errorProperty),
ErrorHint(
'See https://flutter.dev/docs/development/ui/layout/box-constraints for more information.'),
]);
}
I think it is coming from the listview and I have tried every edit possible, even with online resources, I still end up with the same error. I changed the container (initially wrapped around the ListView) into sizedBox, and I also set shrinkwrap to true and added the physics key and value too but nothing got better
Upvotes: 0
Views: 65
Answers (2)
Md. Yeasin Sheikh
Reputation: 63749
You need to provide child on GestureDetector. Also there are some tweaks you can make like using scaffold backgroundColor.
Here is a simple structure
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.black,
leading: IconButton(
onPressed: () {
Navigator.of(context).pop();
},
icon: const Icon(Icons.arrow_back_ios)),
title: const Text('Categories'),
),
backgroundColor: Colors.black,
body: Column(
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: ListView(
physics: const BouncingScrollPhysics(),
children: [
ListTile(
title: const Text(
"Option1",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option2",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option3",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
Container(height: 2, color: Colors.white),
ListTile(
title: const Text(
"Option4",
style: TextStyle(color: Colors.white),
),
onTap: () {},
),
],
),
),
Container(
color: Colors.white,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
onTap: () {},
child: const Text(
"colorpicker",
),
),
const Text("stuff",
style: TextStyle(
color: Colors.white, backgroundColor: Colors.green)),
],
),
)
],
));
}
Upvotes: 0
greetal
Reputation: 1537
You can set the height of sizebox for the ListTile:
height: MediaQuery.of(context).size.height * 0.2,
Upvotes: 0