I make a application in flutter. It's simple. In the principal layout exist an stack. In the first level are a background (what its a simple gradient), and in the second lever are the "body" of the application.
In this body of application i have a column (To put one item below another). this column are divided by separate widgets. One is for the "tile", and other is for a ListView, this ListView will show information from a database, but in this moment i only create 10 items for an example.
The code is this:
//This for a homepage
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: Stack(
children: [
Background(),
HomeBody(),
],
),
);
The background (are in another file, in the homepage are imported):
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: [0.2, 0.8],
colors: [
Color(0xff2E305F),
Color(0xff202333),
],
)),
);
And this is the "body":
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
children: [
PageTitle(),
Changes(),
],
),
);
}
}
class PageTitle extends StatelessWidget {
const PageTitle({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 20),
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
height: 25,
),
Text(
'Biggest Title',
style: TextStyle(
color: Colors.white,
fontSize: 55.0,
fontWeight: FontWeight.bold,
),
),
SizedBox(
//height: 1,
),
Text(
'low subtitle',
style: TextStyle(
color: Colors.white,
fontSize: 14.0,
fontWeight: FontWeight.w300,
),
),
],
),
),
);
}
}
class Changes extends StatelessWidget {
const Changes({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return ListView(
children: [
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
Text('Text0'),
],
);
}
}
The error is:
═══════ Exception caught by rendering library ═════════════════════════════════
The following assertion was thrown during performResize():
Vertical viewport was given unbounded height.
Viewports expand in the scrolling direction to fill their container. In this case, a vertical viewport was given an unlimited amount of vertical space in which to expand. This situation typically happens when a scrollable widget is nested inside another scrollable widget.
If this widget is always nested in a scrollable widget there is no need to use a viewport because there will always be enough vertical space for the children. In this case, consider using a Column instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size the height of the viewport to the sum of the heights of its children.
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
When the exception was thrown, this was the stack
#0 RenderViewport.computeDryLayout.<anonymous closure>
package:flutter/…/rendering/viewport.dart:1369
#1 RenderViewport.computeDryLayout
package:flutter/…/rendering/viewport.dart:1430
#2 RenderBox.performResize
package:flutter/…/rendering/box.dart:2332
#3 RenderObject.layout
package:flutter/…/rendering/object.dart:1758
#4 RenderProxyBoxMixin.performLayout
package:flutter/…/rendering/proxy_box.dart:116
...
The following RenderObject was being processed when the exception was fired: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
RenderObject: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
offset: ScrollPositionWithSingleContext#b9cb0(offset: 0.0, range: null..null, viewport: null, ScrollableState, AlwaysScrollableScrollPhysics -> ClampingScrollPhysics -> RangeMaintainingScrollPhysics, IdleScrollActivity#03740, ScrollDirection.idle)
anchor: 0.0
center child: RenderSliverPadding#e0507 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
padding: EdgeInsets.zero
textDirection: ltr
child: RenderSliverList#2982b NEEDS-LAYOUT NEEDS-PAINT
parentData: paintOffset=Offset(0.0, 0.0)
constraints: MISSING
geometry: null
no children current live
RenderBox was not laid out: RenderViewport#33c99 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
════════════════════════════════════════════════════════════════════════════════
════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderViewport#33c99 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'
The relevant error-causing widget was
ListView
lib/widgets/home_body_screen.dart:64
I'm a newest in flutter, i understand some things, but not all. My opinion is: "this error is caused by her possition, yeah, its scrollable but he does not know where ends". Sorry if i wrong.
thanks all!
shrinkWrap: truefor theListView