I am trying to wrap my column widget in a single child scroll view since I am getting overflow. But when I am trying to wrap it, I am receiving errors such as
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
RenderBox was not laid out: RenderFlex#dc736 relayoutBoundary=up12 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1930 pos 12: 'hasSize'
What can I do to prevent overflow of pixels in my app ? Here is my code:
return Scaffold(
appBar: AppBar(
title: Text('Edit your pet`s details'),
backgroundColor: Color.fromRGBO(101, 69, 112, 1.0),
),
body: Container(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: <Widget> [
Row(
children: <Widget>[
Expanded(
child: TextFieldWidget(
controller: _petNameController,
helperText: "Pet's Name",
)),
],
),
Padding(
padding: const EdgeInsets.only(left: 50.0, right: 50.0),
child: Divider(
color: Colors.grey,
thickness: 0.5,
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(height: 60.0,),
Text(
"$_petName is a $_petGender. Update gender",
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.w400,
),
)
],
),
Expanded(
child: GridView.count(
crossAxisCount: 2,
primary: false,
scrollDirection: Axis.vertical,
children: List.generate(petGenders.length, (index) {
return GestureDetector(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0)),
color:
selectedIndex == index ? primaryColor : null,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
petGenders[petKeys[index]],
SizedBox(
height: 15.0,
),
Text(
petKeys[index],
style: TextStyle(
color: selectedIndex == index
? Colors.white
: null,
fontSize: 18.0,
fontWeight: FontWeight.w600),
),
],
),
),
),
onTap: () {
setState(() {
widget.pet.gender = petKeys[index];
selectedIndex = index;
});
});
}),
),
),
CodePudding user response:
The error comes from the fact that your Column
contains an Extended
widget, which forces to use the maximum vertical space.
The SingleScrollChildView
has no limit to vertical space it can use.
The result is that you have a widget that try to take an infinite vertical space.
How can you fix that ?
Either, remove the Extended
widget, or the SingleScrollChildView
widget.
Or, you can also wrap your Extended
widget with another widget with a defined size or constraints like a Container
with the properties height
and width
.