Home > front end >  Flutter Stack with Expended widget got error
Flutter Stack with Expended widget got error

Time:10-29

I got "Each child must be laid out exactly once." and "Incorrect use of ParentDataWidget" for following code.

I want to Bottom Panel to persistence for all screen. So I create Base Widget. It is working fine if I don't use stack. I used Stack because my bottom panel has rounded corner and want to make corner transparent.

So now bottom panel is transparent but got the error.

Widget build(BuildContext context) {
return Scaffold(
  backgroundColor: Colors.transparent,
  body: Stack(
    children: [
      Positioned(
        left: 0,
        right: 0,
        top: 0,
        height: MediaQuery.of(context).size.height,
        child: Expanded(
          child: child,
        ),
      ),
      const Positioned(
        left: 0,
        right: 0,
        bottom: 0,
        child: BottomPanel(),
      ),
    ],
  ),
);
  }
}

enter image description here

CodePudding user response:

You can't use Expanded widget inside positioned or stack widget. You have to wrap that Expanded widget in Row, flex or Column if you want to use Expanded or try another way to achieve this task

Using an Expanded widget makes a child of a Row, Column, or Flex expand to fill the available space along the main axis (e.g., horizontally for a Row or vertically for a Column). If multiple children are expanded, the available space is divided among them according to the flex factor.

CodePudding user response:

You should use Positioned.fill instead of Positioned with Expanded as a child instead. Do it like this:

Widget build(BuildContext context) {
return Scaffold(
  backgroundColor: Colors.transparent,
  body: Stack(
    children: [
      Positioned.fll(
        child: child, // if you want to specify this widget height add it here
      ),
      const Positioned(
        left: 0,
        right: 0,
        bottom: 0,
        child: BottomPanel(),
      ),
    ],
  ),
);
  }
}
  • Related