Error during layout -- BoxConstrains forces an infinite height

1,530 views
Skip to first unread message

the_aceix

unread,
Jun 4, 2018, 2:09:12 PM6/4/18
to Flutter Dev
Hello devs, i want to make a scrollable textview so I went for this layout:
Center > Container > Column > LayoutBuilder(so i can know the screen/parent's size) > Container > ListView > Text

ERROR:
I/flutter (23908): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (23908): The following assertion was thrown during performLayout():
I/flutter (23908): BoxConstraints forces an infinite height.
I/flutter (23908): These invalid constraints were provided to RenderRepaintBoundary's layout() function by the
I/flutter (23908): following function, which probably computed the invalid constraints in question:
I/flutter (23908):   RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:259:13)
I/flutter (23908): The offending constraints were:
I/flutter (23908):   BoxConstraints(w=300.0, h=Infinity)

Suspected error code:
return new Scaffold(
     body: new Column(
       children: <Widget>[
         // image header
         new SizeTransition(
           sizeFactor: new Tween<double>(
             begin: 0.0,
             end: 1.0,
           ).animate(
             new CurvedAnimation(
               curve: Curves.easeIn,
               parent: _animationController,
             )
           ),
           axis: Axis.vertical,
           child: new GestureDetector(
             onTap: _animateImage,
             child: new Container(
               // width: 10.0,
               child: new Image.asset(
                 'assets/img/3.png',
                 fit: BoxFit.cover,
               ),
             ),
           ),
         ),
         new Center(
           child: new Container(
             margin: const EdgeInsets.all(30.0),
             child: new Column(
               children: <Widget>[
                 titleRow,
                 // new Divider(),
                 buttonRow,
                 new Divider(),
                 new LayoutBuilder(
                   builder: (BuildContext context, BoxConstraints constraints) =>
                     new Container(
                       height: constraints.biggest.height,
                       width: constraints.biggest.width,
                       margin: const EdgeInsets.only(
                         top: 20.0,
                         bottom: 40.0,
                       ),
                       child: new ListView(
                         children: <Widget>[
                           new Text(
                             content,
                             style: new TextStyle(
                               fontSize: 17.0,
                               wordSpacing: 2.0,
                               fontWeight: FontWeight.w300,
                             ),
                           ),
                         ],
                       ),
                     ),
                 ),
               ],
             ),
           ),
         ),
       ],
     ),
   );





Full code:

import 'package:flutter/material.dart';

class CharacterProfileScreen extends StatefulWidget{
@override
CharacterProfileScreenState createState() {
return new CharacterProfileScreenState();
}
}

class CharacterProfileScreenState extends State<CharacterProfileScreen> with SingleTickerProviderStateMixin{
bool _favorite = true;
int _likes = 137;
AnimationController _animationController;

void _stopAnimation() {
// print('${_animationController.value}');
if(_animationController.value >= .5 &&
_animationController.value <= .6 &&
_animationController.status == AnimationStatus.reverse){
_animationController.stop();
}
}

void _onFavoriteTap(){
if(_favorite){
_favorite = false;
_likes -= 1;
}
else{
_favorite = true;
_likes += 1;
}
setState(()=>{});
}

@override
void initState(){
_animationController = new AnimationController(
vsync: this,
duration: const Duration(milliseconds: 1000),
);
_animationController.addListener(_stopAnimation);
_animationController.forward();
super.initState();
}

@override
void dispose(){
_animationController.dispose();
super.dispose();
}

@override
Widget build(BuildContext context) {
String content = 'Aang was a male Air Nomad born in 12 BG and the Avatar during the century-long conflict known as the Hundred Year War. His immediate predecessor was Avatar Roku, and his immediate successor is Avatar Korra. As the Avatar of his time, he was the only person capable of using all four bending arts: airbending, waterbending, earthbending, and firebending. He was also one of a select few Avatars, and one of the first in many cycles to learn the ancient art of energybending, and the first Avatar known to have actively used the technique.';

Widget titleRow = new Row(
children: <Widget>[
new Expanded(
child: new Column(
children: <Widget>[
new Text(
'Avatar Aang',
style: new TextStyle(
color: Colors.grey[800],
fontSize: 23.0,
fontWeight: FontWeight.bold,
),
),
new Text(
'aka: Twinkle Toes, Kuzon, Sweetie',
style: new TextStyle(
color: Colors.grey,
fontWeight: FontWeight.w300,
),
),
],
),
),
new IconButton(
onPressed: _onFavoriteTap,
icon: _favorite
? new Icon(
Icons.favorite,
color: Colors.red,
)
: new Icon(
Icons.favorite_border,
color: Colors.red,
),
),
new SizedBox(
width: 40.0,
child: new Padding(
padding: const EdgeInsets.all(8.0),
child: new Text('$_likes'),
),
),
],
);
var buildButtonRowButtons = (IconData icon, String text) =>
new Container(
child: new InkWell(
onTap: () => {},
borderRadius: BorderRadius.circular(8.0),
child: new SizedBox(
width: 80.0,
child: new Column(
children: <Widget>[
new Icon(
icon,
color: Colors.blue,
),
new Text(
text,
style: new TextStyle(
color: Colors.blue,
),
)
],
),
),
),
);

Widget buttonRow = new Container(
margin: const EdgeInsets.only(top: 20.0),
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
buildButtonRowButtons(Icons.navigation, 'Visit Page'),
buildButtonRowButtons(Icons.thumb_up, 'Like'),
buildButtonRowButtons(Icons.share, 'Share'),
],
),
);

void _animateImage(){
if(_animationController.value == 1.0)
_animationController.reverse();
else
_animationController.forward();
}

return new Scaffold(
body: new Column(
children: <Widget>[
// image header
new SizeTransition(
sizeFactor: new Tween<double>(
begin: 0.0,
end: 1.0,
).animate(
new CurvedAnimation(
curve: Curves.easeIn,
parent: _animationController,
)
),
axis: Axis.vertical,
child: new GestureDetector(
onTap: _animateImage,
child: new Container(
// width: 10.0,
child: new Image.asset(
'assets/img/3.png',
fit: BoxFit.cover,
),
),
),
),
new Center(
child: new Container(
margin: const EdgeInsets.all(30.0),
child: new Column(
children: <Widget>[
titleRow,
// new Divider(),
buttonRow,
new Divider(),
new LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) =>
new Container(
height: constraints.biggest.height,
width: constraints.biggest.width,
margin: const EdgeInsets.only(
top: 20.0,
bottom: 40.0,
),
child: new ListView(
children: <Widget>[
new Text(
content,
style: new TextStyle(
fontSize: 17.0,
wordSpacing: 2.0,
fontWeight: FontWeight.w300,
),
),
],
),
),
),
],
),
),
),
],
),
);
}
}


Reply all
Reply to author
Forward
0 new messages