Search code examples
flutterdartflutter-layout

Flutter doesn't want to render Expanded widget inside Row

My intention

I am learning Flutter through a personal project and I want my "Edit profile" OutlinedButton to be as far as possible from the two Text widgets on the left.

This is an edited image to illustrate my goal.

goal

In the following image I use a Container to display the informations

image

My Problem

But when I change the Container (which contains a Row in which there are the two Text Widgets) to an Expanded widget, my page is blank and an error mentions

Unexpected null value

class AccountInformation extends StatelessWidget {
  const AccountInformation({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Expanded(
            child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: [
                  Text(context.watch<WobbleNotifier>().account?.username ?? "user"),
                  Text(context.watch<WobbleNotifier>().account?.email ?? "email"),
                ]
            )
        ),
        OutlinedButton(
            onPressed: null,
            child: Text(AppLocalizations.of(context)!.editProfile)
        )
      ],
    );
  }
}

Thank you for any input on how to solve this !

Context

The AccountInformation widget is contained in this panel:

class AccountPanel extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.5),
            spreadRadius: 3,
            blurRadius: 6,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Row(
        children: [
          const Icon(Icons.person),
          Column(
            children: [
              const AccountInformation(),
              Row(
                children: [
                  Column(
                    children: [
                      const Text('0'),
                      Text(AppLocalizations.of(context)!.workouts),
                    ],
                  ),
                  Column(
                    children: [
                      const Text('0'),
                      Text(AppLocalizations.of(context)!.followers),
                    ],
                  ),
                  Column(
                    children: [
                      const Text('0'),
                      Text(AppLocalizations.of(context)!.following_plural),
                    ],
                  ),
                ]
              )
            ],
          )
        ],
      ),
    );
  }

  const AccountPanel({Key? key}) : super(key: key);
}

And the panel is in a ListView

@override
  Widget build(BuildContext context) {
    return ListView(
      children: const [
        AccountPanel()
      ],
    );
  }

Error message

Error: Unexpected null value.
    at Object.throw_ [as throw] (http://localhost:55547/dart_sdk.js:5080:11)
    at Object.nullCheck (http://localhost:55547/dart_sdk.js:5399:30)
    at viewport.RenderViewport.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/sliver.dart.lib.js:1936:21)
    at viewport.RenderViewport.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderIgnorePointer.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderIgnorePointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderIgnorePointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:3518:38)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderPointerListener.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderPointerListener.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderSemanticsGestureHandler.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsGestureHandler.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderPointerListener.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderPointerListener.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at scrollable$._RenderScrollSemantics.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at scrollable$._RenderScrollSemantics.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderRepaintBoundary.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderRepaintBoundary.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at custom_paint.RenderCustomPaint.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at custom_paint.RenderCustomPaint.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/custom_paint.dart.lib.js:325:20)
    at custom_paint.RenderCustomPaint.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderMouseRegion.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderMouseRegion.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderMouseRegion.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:3279:20)
    at proxy_box.RenderPointerListener.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderPointerListener.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderSemanticsGestureHandler.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsGestureHandler.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderRepaintBoundary.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderRepaintBoundary.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at http://localhost:55547/packages/flutter/src/rendering/shifted_box.dart.lib.js:149:47
    at box.BoxHitTestResult.wrap.addWithPaintOffset (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7813:19)
    at shifted_box.RenderPositionedBox.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/shifted_box.dart.lib.js:147:23)
    at shifted_box.RenderPositionedBox.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:8068:44
    at box.BoxHitTestResult.wrap.addWithPaintOffset (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7813:19)
    at custom_layout.RenderCustomMultiChildLayoutBox.new.defaultHitTestChildren (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:8066:30)
    at custom_layout.RenderCustomMultiChildLayoutBox.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/custom_layout.dart.lib.js:283:19)
    at custom_layout.RenderCustomMultiChildLayoutBox.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at material._RenderInkFeatures.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at material._RenderInkFeatures.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderPhysicalModel.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderPhysicalModel.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderPhysicalModel.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2190:20)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderRepaintBoundary.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderRepaintBoundary.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderIgnorePointer.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderIgnorePointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderIgnorePointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:3518:38)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:179
    at box.BoxHitTestResult.wrap.addWithRawTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7830:19)
    at box.BoxHitTestResult.wrap.addWithPaintTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7801:19)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:21)
    at proxy_box.RenderTransform.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2655:19)
    at proxy_box.RenderAnimatedOpacity.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderAnimatedOpacity.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:179
    at box.BoxHitTestResult.wrap.addWithRawTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7830:19)
    at box.BoxHitTestResult.wrap.addWithPaintTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7801:19)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:21)
    at proxy_box.RenderTransform.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2655:19)
    at proxy_box.RenderAnimatedOpacity.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderAnimatedOpacity.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at basic._RenderColoredBox.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at basic._RenderColoredBox.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:179
    at box.BoxHitTestResult.wrap.addWithRawTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7830:19)
    at box.BoxHitTestResult.wrap.addWithPaintTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7801:19)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:21)
    at proxy_box.RenderTransform.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2655:19)
    at proxy_box.RenderAnimatedOpacity.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderAnimatedOpacity.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:179
    at box.BoxHitTestResult.wrap.addWithRawTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7830:19)
    at box.BoxHitTestResult.wrap.addWithPaintTransform (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7801:19)
    at proxy_box.RenderTransform.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2660:21)
    at proxy_box.RenderTransform.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:2655:19)
    at proxy_box.RenderAnimatedOpacity.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderAnimatedOpacity.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at basic._RenderColoredBox.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at basic._RenderColoredBox.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at proxy_box.RenderRepaintBoundary.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderRepaintBoundary.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at routes._RenderFocusTrap.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at routes._RenderFocusTrap.new.hitTest (http://localhost:55547/packages/flutter/src/widgets/title.dart.lib.js:16083:26)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderOffstage.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderOffstage.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderOffstage.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:3617:38)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at http://localhost:55547/packages/flutter/src/widgets/title.dart.lib.js:26893:42
    at box.BoxHitTestResult.wrap.addWithPaintOffset (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:7813:19)
    at overlay$._RenderTheatre.new.hitTestChildren (http://localhost:55547/packages/flutter/src/widgets/title.dart.lib.js:26891:28)
    at overlay$._RenderTheatre.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderAbsorbPointer.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderAbsorbPointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderAbsorbPointer.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:3691:68)
    at proxy_box.RenderPointerListener.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderPointerListener.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:538:26)
    at custom_paint.RenderCustomPaint.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at custom_paint.RenderCustomPaint.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/custom_paint.dart.lib.js:325:20)
    at custom_paint.RenderCustomPaint.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at proxy_box.RenderSemanticsAnnotations.new.hitTestChildren (http://localhost:55547/packages/flutter/src/rendering/proxy_box.dart.lib.js:438:56)
    at proxy_box.RenderSemanticsAnnotations.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4463:18)
    at view.RenderView.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:4744:58)
    at binding$5.WidgetsFlutterBinding.new.hitTest (http://localhost:55547/packages/flutter/src/rendering/layer.dart.lib.js:5540:23)
    at [_handlePointerEventImmediately] (http://localhost:55547/packages/flutter/src/gestures/binding.dart.lib.js:312:14)
    at binding$5.WidgetsFlutterBinding.new.handlePointerEvent (http://localhost:55547/packages/flutter/src/gestures/binding.dart.lib.js:305:43)
    at [_flushPointerEventQueue] (http://localhost:55547/packages/flutter/src/gestures/binding.dart.lib.js:295:14)
    at [_handlePointerDataPacket] (http://localhost:55547/packages/flutter/src/gestures/binding.dart.lib.js:286:54)
    at Object.invoke1 (http://localhost:55547/dart_sdk.js:191747:7)
    at _engine.EnginePlatformDispatcher.__.invokeOnPointerDataPacket (http://localhost:55547/dart_sdk.js:171943:15)
    at [_onPointerData] (http://localhost:55547/dart_sdk.js:172879:49)
    at http://localhost:55547/dart_sdk.js:173306:26
    at http://localhost:55547/dart_sdk.js:173273:16
    at loggedHandler (http://localhost:55547/dart_sdk.js:172978:11)
Solution

  • I didn't want to use paddings as they use fixed values and it would have looked different on other screens but thanks to your answer @yeasin-sheikh I found a solution by wrapping the Column containing the AccountInformation Widget in an Expanded widget.

    So I achieved my goal only using Expanded.

    Now I need to understand why it works.

    enter image description here

    import 'package:app/widgets/account/account.information.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

class AccountPanel extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.5),
            spreadRadius: 3,
            blurRadius: 6,
            offset: const Offset(0, 3),
          ),
        ],
      ),
      child: Row(
        children: [
          const Icon(Icons.person),
          // Here, I wrapped everything in the Expanded widget
          Expanded(child: Column(
            children: [
              const AccountInformation(),
              Row(
                  children: [
                    Column(
                      children: [
                        const Text('0'),
                        Text(AppLocalizations.of(context)!.workouts),
                      ],
                    ),
                    Column(
                      children: [
                        const Text('0'),
                        Text(AppLocalizations.of(context)!.followers),
                      ],
                    ),
                    Column(
                      children: [
                        const Text('0'),
                        Text(AppLocalizations.of(context)!.following_plural),
                      ],
                    ),
                  ]
              )
            ],
          ))
        ],
      ),
    );
  }

  const AccountPanel({Key? key}) : super(key: key);
}