CODEWITHSUNDEEP
dartflutterflutter-layout
Jose Antonio
Jose Antonio

Reputation: 598

Flutter - exception after adding list of Cards and Text on the same page

I want to display a Text (or another type of Content) and a list of Cards. I am able to display only the list of Cards but it throws an exception if I add another class.

Code for only the list of Cards (it works):

class CardPageState extends State<CardPage> {

  //DeckCard is a class which contains title, description, etc
  final decks = <DeckCard>[];

  CardPageState(data){
    decks.addAll(data);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: buildCardPage(),
    );
  }

  Widget buildCardPage() {
    return new Container(
          child: new ListView.builder(
                itemCount: decks.length,
                itemBuilder: /*1*/ (context, i) {
                  return _buildRow(decks[i]);
                })


    );
  }

  Widget _buildRow(DeckCard deckCard) {

    return new Card(
        child: Text(deckCard.getTitle(), style: TextStyle(fontWeight: FontWeight.bold,fontSize: 20, color:Colors.black),)
    );
  }
}

CardPage is called from a main page with a body: 

body: new Container(
        child: new FutureBuilder<DeckCardResponse>(
        future: fetchDecksFromFirebase(),
        builder: (context, snapshot) {

            if (snapshot.hasData) {
                return new CardPage(snapshot.data.getDecks());

            }
            else if (snapshot.hasError) {
                return new MessageError(499);

            }
            return new CircularProgressIndicator(strokeWidth: 5.0);
        }),
    )

When I try to add another content and it throws an exception:

Widget buildCardPage() {
    return new Container(
          child:
          new Column(
            children:[
              new Text("hello", style: TextStyle(fontWeight: FontWeight.bold,fontSize: 20, color:Colors.black),),
              new Container(
                child: new ListView.builder(
                itemCount: decks.length,
                itemBuilder: /*1*/ (context, i) {
                  return _buildRow(decks[i]);
                })

              ),
            ]
          ),
    );

Any idea? I tried with only a Column without the previous Container, however, I have the same exception.

I/flutter (18134): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (18134): The following assertion was thrown during performResize():
I/flutter (18134): Vertical viewport was given unbounded height.
I/flutter (18134): Viewports expand in the scrolling direction to fill their container.In this case, a vertical
I/flutter (18134): viewport was given an unlimited amount of vertical space in which to expand. This situation
I/flutter (18134): typically happens when a scrollable widget is nested inside another scrollable widget.
I/flutter (18134): If this widget is always nested in a scrollable widget there is no need to use a viewport because
I/flutter (18134): there will always be enough vertical space for the children. In this case, consider using a Column
I/flutter (18134): instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size
I/flutter (18134): the height of the viewport to the sum of the heights of its children.
I/flutter (18134): 
I/flutter (18134): When the exception was thrown, this was the stack:
I/flutter (18134): #0      RenderViewport.performResize.<anonymous closure> (package:flutter/src/rendering/viewport.dart:1135:15)
I/flutter (18134): #1      RenderViewport.performResize (package:flutter/src/rendering/viewport.dart:1188:6)
I/flutter (18134): #2      RenderObject.layout (package:flutter/src/rendering/object.dart:1617:9)
I/flutter (18134): #3      _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #4      RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #5      _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #6      RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #7      _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #8      RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #9      _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #10     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #11     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #12     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #13     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #14     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #15     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #16     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #17     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #18     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #19     RenderFlex.performLayout (package:flutter/src/rendering/flex.dart:738:15)
I/flutter (18134): #20     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #21     MultiChildLayoutDelegate.layoutChild (package:flutter/src/rendering/custom_layout.dart:142:11)
I/flutter (18134): #22     _ScaffoldLayout.performLayout (package:flutter/src/material/scaffold.dart:350:7)
I/flutter (18134): #23     MultiChildLayoutDelegate._callPerformLayout (package:flutter/src/rendering/custom_layout.dart:212:7)
I/flutter (18134): #24     RenderCustomMultiChildLayoutBox.performLayout (package:flutter/src/rendering/custom_layout.dart:356:14)
I/flutter (18134): #25     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #26     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #27     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #28     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #29     _RenderCustomClip.performLayout (package:flutter/src/rendering/proxy_box.dart:1206:11)
I/flutter (18134): #30     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #31     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #32     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #33     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #34     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #35     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #36     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #37     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #38     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #39     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #40     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #41     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #42     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #43     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #44     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #45     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #46     RenderOffstage.performLayout (package:flutter/src/rendering/proxy_box.dart:3032:13)
I/flutter (18134): #47     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #48     RenderStack.performLayout (package:flutter/src/rendering/stack.dart:510:15)
I/flutter (18134): #49     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #50     __RenderTheatre&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #51     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #52     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #53     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #54     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #55     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #56     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #57     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #58     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #59     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #60     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout (package:flutter/src/rendering/proxy_box.dart:105:13)
I/flutter (18134): #61     RenderObject.layout (package:flutter/src/rendering/object.dart:1632:7)
I/flutter (18134): #62     RenderView.performLayout (package:flutter/src/rendering/view.dart:151:13)
I/flutter (18134): #63     RenderObject._layoutWithoutResize (package:flutter/src/rendering/object.dart:1507:7)
I/flutter (18134): #64     PipelineOwner.flushLayout (package:flutter/src/rendering/object.dart:766:18)
I/flutter (18134): #65     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:329:19)
I/flutter (18134): #66     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:701:13)
I/flutter (18134): #67     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:268:5)
I/flutter (18134): #68     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:988:15)
I/flutter (18134): #69     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:928:9)
I/flutter (18134): #70     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:749:7)
I/flutter (18134): #72     _Timer._runTimers (dart:isolate/runtime/libtimer_impl.dart:382:19)
I/flutter (18134): #73     _Timer._handleMessage (dart:isolate/runtime/libtimer_impl.dart:416:5)
I/flutter (18134): #74     _RawReceivePortImpl._handleMessage (dart:isolate/runtime/libisolate_patch.dart:171:12)
I/flutter (18134): (elided one frame from package dart:async)
I/flutter (18134): 
I/flutter (18134): The following RenderObject was being processed when the exception was fired:
I/flutter (18134):   RenderViewport#85bc5 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (18134):   creator: Viewport ← IgnorePointer-[GlobalKey#ddac3] ← Semantics ← Listener ← _GestureSemantics ←
I/flutter (18134):   RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#142b9] ← _ScrollableScope ←
I/flutter (18134):   _ScrollSemantics-[GlobalKey#1902d] ← RepaintBoundary ← CustomPaint ← RepaintBoundary ←
I/flutter (18134):   NotificationListener<ScrollNotification> ← ⋯
I/flutter (18134):   parentData: <none> (can use size)
I/flutter (18134):   constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=Infinity)
I/flutter (18134):   size: MISSING
I/flutter (18134):   axisDirection: down
I/flutter (18134):   crossAxisDirection: right
I/flutter (18134):   offset: ScrollPositionWithSingleContext#06797(offset: 0.0, range: null..null, viewport: null,
I/flutter (18134):   ScrollableState, AlwaysScrollableScrollPhysics -> ClampingScrollPhysics, IdleScrollActivity#c3663,
I/flutter (18134):   ScrollDirection.idle)
I/flutter (18134):   anchor: 0.0
I/flutter (18134): This RenderObject had the following descendants (showing up to depth 5):
I/flutter (18134):   RenderSliverPadding#e7182 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (18134):     RenderSliverList#6b5c0 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (18134): ════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderViewport#85bc5 NEEDS-LAYOUT NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderViewport#85bc5 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderIgnorePointer#c5ace relayoutBoundary=up9 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderSemanticsAnnotations#f4095 relayoutBoundary=up8 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderPointerListener#1d571 relayoutBoundary=up7 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderSemanticsGestureHandler#5cee1 relayoutBoundary=up6 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: _RenderScrollSemantics#1f2eb relayoutBoundary=up5 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderRepaintBoundary#70e3d relayoutBoundary=up4 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderCustomPaint#b103f relayoutBoundary=up3 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderRepaintBoundary#4b75f relayoutBoundary=up2 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: RenderBox was not laid out: RenderFlex#aaf3d relayoutBoundary=up1 NEEDS-PAINT
I/flutter (18134): Another exception was thrown: NoSuchMethodError: The method '<=' was called on null.
Reloaded 2 of 573 libraries in 1,622ms.

Upvotes: 0

Views: 223

Answers (1)

Mazin Ibrahim
Mazin Ibrahim

Reputation: 7889

You have to give the parent Container a height as listview and Column widgets expands to match the height of their parent, which is in your case the Container.Try giving it the screen height using MediaQuery if you don't have any certain size in mind:

    body: new Container(
    height: MediaQuery.of(context).size.height, // This will make the size of it the same as the device screen
    child: new FutureBuilder<DeckCardResponse>(
    future: fetchDecksFromFirebase(),
    builder: (context, snapshot) {

        if (snapshot.hasData) {
            return new CardPage(snapshot.data.getDecks());

        }
        else if (snapshot.hasError) {
            return new MessageError(499);

        }
        return new CircularProgressIndicator(strokeWidth: 5.0);
    }),
)

Upvotes: 1

Related Questions