Mounika
Mounika

Reputation: 3988

Incorrect use of parent data widget. expanded widgets must be placed inside flex widgets

I am getting the following error:

i.e.., Another exception was thrown: Incorrect use of ParentDataWidget. showing error on the mobile screen.

 @override
  Widget build(BuildContext context) {

    return MaterialApp(
      title: widget.title,
      theme: ThemeData.light().copyWith(
        platform: _platform ?? Theme.of(context).platform,
      ),
      home: DefaultTabController(
        length: categoryNames.length,
        child: Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
                 ),
        body: SafeArea(
            child: Column(
              children: <Widget>[
                Chewie(
                  controller: _chewieController,
                ),
                TabBar(
                  labelColor:Colors.black,
                  tabs: categoryNames,
                ),
                Expanded(
                  child: TabBarView(
                    children: [
                      ImageList()
                    ],
                  ),
                )
                /*TabBarView(
                  children: [
                    Icon(Icons.directions_car),
                    Icon(Icons.directions_transit),
                    Icon(Icons.directions_bike),
                  ],
                )*/
              ],
            )
        ),
      ),
      ),
    );
  }

It's my code, please check and let me know the issue.

Upvotes: 295

Views: 406367

Answers (18)

David Chopin
David Chopin

Reputation: 3064

For me, I was wrapping a Spacer in an Expanded, like so:

@override
Widget build(BuildContext context) {

  Widget myWidget;

  if (math.Random().nextBool()) {
    myWidget = Spacer();
  } else {
    myWidget = Text('Hello world!');
  }

  return Expanded(myWidget);
}

If we take a look at Spacer under-the-hood, we see that it wraps the passed child in an Expanded. So, wrapping Spacer in Expanded creates a scenario where the Spacer's Expanded is not the direct descendant of a Flex widget:

@override
Widget build(BuildContext context) {
  return Expanded(
    flex: flex,
    child: const SizedBox.shrink(),
  );
}

Upvotes: 0

Dip Chowdhury
Dip Chowdhury

Reputation: 178

In my case, I was using a RichText inside the ListView -> ListTile(title: RichText)

That was having softWrap: true which caused me the issue. All other answer also satisfies this solution.

Upvotes: 0

Thiago Dias
Thiago Dias

Reputation: 161

Expanded() can only be used inside Row(), Column() and Flex()

Flexible() can only be used within Row(), Column() and Flex().

Positioned() can only be used inside Stack().

TableCell() can only be used inside Table().

Two or more Expanded() do not have the same parent. Observe the example below, it will certainly give a ParentWidgetError! Because there are two Expanded() within the same widget, there are two Expanded() "competing with each other". In your specific case, I believe it is the error above. However, I need more details to say with 100% certainty.

Column(
  children: [
    Expanded(child: child)
    Expanded(child: child)
  ],
)

Upvotes: 9

Mulualem M
Mulualem M

Reputation: 71

In my case I used Positioned widget without using parent widget Stack. I fixed using parent widget Stack for Positioned.

   return Stack(
  children: [
    Positioned(
        
    ),
  ],
);

Upvotes: 0

Akbar Masterpadi
Akbar Masterpadi

Reputation: 1196

There are many things to get this problem.

For example:

  1. Under ListView don't use Spacer Widget
  2. don't use Positioned under Row or Column
  3. Expanded can only use it must be a descendant of Column Row Flex

Upvotes: 83

Bhargav Raviya
Bhargav Raviya

Reputation: 409

 Padding(
                      padding: const EdgeInsets.symmetric(
                          horizontal: 25, vertical: 20),
                      child: Card(
                        child: SingleChildScrollView(
                          scrollDirection: Axis.horizontal,
                          child: Expanded(child: _buildDataTable(data, fields)),
                        ),
                      ),
                    )

give real life to my device emulator and during other emulator devices working fine

but this is not working on a real device like an Android phone, then follow the rule of

First Rule: Use Expanded only within a column, row, or flex.

Second Rule: Parent columns that have expanded child columns must be wrapped with expanded columns as well.

remove Expanded

Padding(
                      padding: const EdgeInsets.symmetric(
                          horizontal: 25, vertical: 20),
                      child: Card(
                        child: SingleChildScrollView(
                          scrollDirection: Axis.horizontal,
                          child: _buildDataTable(data, fields),
                        ),
                      ),
                    ),

Upvotes: 2

Sanket Vanani
Sanket Vanani

Reputation: 546

Just remove the Expanded.

You should have to use Expanded whenever needed.

Check the below image for reference.

Removed expanded and it works perfect

Upvotes: 4

AnasSafi
AnasSafi

Reputation: 6284

You can use Expanded as child of scrolling parent like this:

Scaffold(
  body: CustomScrollView(
    physics: const AlwaysScrollableScrollPhysics(),
    slivers: [
      SliverFillRemaining(
        fillOverscroll: true,
        child: Column(
          children: <Widget>[
            Container(color: Colors.red,height: 100),
            Expanded(
              child: Container(color: Colors.purple,),
            ),
          ],
        ),
      )
    ],
  ),
)

Upvotes: -1

Samet &#214;ZTOPRAK
Samet &#214;ZTOPRAK

Reputation: 3374

My issue is because of Expand

          child: Expanded(
            child: SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: Column(
                children: getChildren(cubit.listPerformer, state),
              ),

After delete Expand, it works fine.

Upvotes: 11

edalvb
edalvb

Reputation: 724

In my case it was because I was enclosing an Expanded inside a SizedBox, I just enclosed the Expanded inside a Row and that's it.

Upvotes: 1

sithum dilanga
sithum dilanga

Reputation: 487

In my case, I was using Expanded inside a Padding widget. Padding was inside a column but since Expanded was wrapped by a Padding it gave me the error. Simply removing Expanded solved my issue.

Upvotes: 1

Bilal Awan
Bilal Awan

Reputation: 5370

Expanded cannot be used inside a Stack.

You should use Expanded only within a Column, Row or Flex

Upvotes: 517

Srikanth
Srikanth

Reputation: 21

This Solution works only if you are using Position as a parent of row or column

In my case, I was using Positioned inside a column. Removing it solved the problem!

Else

Always remember to use Expanded in Row, Column or Flex

Upvotes: 2

mjukka
mjukka

Reputation: 81

I removed a Positioned widget that was inside a Container inside a Stack and the problem "Incorrect use of ParentDataWidget" went away.

Upvotes: 7

M.AQIB
M.AQIB

Reputation: 383

In my case, I was using Positioned inside a column. Removing it solved the problem!

Upvotes: 7

oth man
oth man

Reputation: 303

there's no expanded in my code so i found that using Spacer() too can cause this error if it's inside a listview

Upvotes: 8

Thaw Thu Han
Thaw Thu Han

Reputation: 21

when I skip the video, the chewie controller shows these errors when I fix in chewie package error gone.

please fix in material_controls.dart here

[remove expanded widget in Stack widget]

return MouseRegion(
  onHover: (_) {
    _cancelAndRestartTimer();
  },
  child: GestureDetector(
    onTap: () => _cancelAndRestartTimer(),
    child: AbsorbPointer(
      absorbing: notifier.hideStuff,
      child: Stack(
        children: [
          if (_latestValue.isBuffering)
            const Expanded(
              child: Center(
                child: CircularProgressIndicator(),
              )
            )
          else
            _buildHitArea(),
          _buildActionBar(),
          Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              if (_subtitleOn)
                Transform.translate(
                  offset: Offset(
                      0.0, notifier.hideStuff ? barHeight * 0.8 : 0.0),
                  child:
                      _buildSubtitles(context, chewieController.subtitle!),
                ),
              _buildBottomBar(context),
            ],
          ),
        ],
      ),
    ),
  ),
);

}

Upvotes: 2

secreal
secreal

Reputation: 1205

First Rule: use Expanded only within a column, row or flex.

Second Rule: Parent column that have expanded child column must be wrapped with expanded as well

Upvotes: 108

Related Questions