Wikipedia Reader App fails to render

[rustygeldmacher]

Page URL

https://docs.flutter.dev/learn/pathway/tutorial/listenable-builder

Page source

https://github.com/flutter/website/blob/main/src/content/learn/pathway/tutorial/listenable-builder.md

Describe the problem

Hi there! Going through this wonderful tutorial and when I went to hot-reload after entering all the code, I got a render error like this:

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following assertion was thrown during performLayout():
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
When a column is in a parent that does not provide a finite height constraint, for example if it is
in a vertical scrollable, it will try to shrink-wrap its children along the vertical axis. Setting a
flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining
space in the vertical direction.
These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child
cannot simultaneously expand to fit its parent.
Consider setting mainAxisSize to MainAxisSize.min and using FlexFit.loose fits for the flexible
children (using Flexible rather than Expanded). This will allow the flexible children to size
themselves to less than the infinite remaining space they would otherwise be forced to take, and
then will cause the RenderFlex to shrink-wrap the children rather than expanding to fit the maximum
constraints provided by the parent.
If this message did not help you determine the problem, consider using debugDumpRenderTree():
  https://flutter.dev/to/debug-render-layer
  https://api.flutter.dev/flutter/rendering/debugDumpRenderTree.html
The affected RenderFlex is:
  RenderFlex#51242 relayoutBoundary=up15 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE(creator: Column ← _SingleChildViewport ← IgnorePointer-[GlobalKey#17b62] ← Semantics ←
  Listener ← _GestureSemantics ← RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#76f16] ← Listener ← _ScrollableScope ← _ScrollSemantics-[GlobalKey#eb1b3] ←
  NotificationListener<ScrollMetricsNotification> ← RepaintBoundary ← ⋯, parentData: <none> (can use size), constraints: BoxConstraints(0.0<=w<=959.0, 0.0<=h<=Infinity), size: MISSING,
  direction: vertical, mainAxisAlignment: start, mainAxisSize: max, crossAxisAlignment: center, verticalDirection: down, spacing: 0.0)
The creator information is set to:
  Column ← _SingleChildViewport ← IgnorePointer-[GlobalKey#17b62] ← Semantics ← Listener ←
  _GestureSemantics ← RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#76f16] ←
  Listener ← _ScrollableScope ← _ScrollSemantics-[GlobalKey#eb1b3] ←
  NotificationListener<ScrollMetricsNotification> ← RepaintBoundary ← ⋯
The nearest ancestor providing an unbounded width constraint is: _RenderSingleChildViewport#ece48 relayoutBoundary=up14 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE:
  needs compositing
  creator: _SingleChildViewport ← IgnorePointer-[GlobalKey#17b62] ← Semantics ← Listener ←
    _GestureSemantics ← RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#76f16] ←
    Listener ← _ScrollableScope ← _ScrollSemantics-[GlobalKey#eb1b3] ←
    NotificationListener<ScrollMetricsNotification> ← RepaintBoundary ← CustomPaint-[GlobalKey#7febb]
    ← ⋯
  parentData: <none> (can use size)
  constraints: BoxConstraints(0.0<=w<=959.0, 0.0<=h<=868.0)
  size: MISSING
  offset: Offset(0.0, -0.0)
See also: https://flutter.dev/unbounded-constraints
If none of the above helps enough to fix this problem, please don't hesitate to file a bug:
  https://github.com/flutter/flutter/issues/new?template=02_bug.yml

The relevant error-causing widget was:
  Column
  Column:file:///Users/rgeldmac/Library/CloudStorage/Dropbox/src/FlutterTutorials/wikipedia_reader/lib/main.dart:70:14

Expected fix

A few minutes with Claude told me to remove the Flexible from ArticlePage and that did the trick, though I wonder if that changed how you envisioned the page to work.

Thanks and keep up the great job!

Additional context

No response

I would like to fix this problem.

• I will try and fix this problem on docs.flutter.dev.

[warioddly]

Hi, closes #13066