Stacking two containers in Flutter

I am trying to stack lets say Container B on Container A like in following picture, but it’s not working in my case, must be an error in positioning the widgets.

My code:
body: Stack(
        children: [
          Column(
            children: [
              Container(
                //this contains content of container A with a width of maxFinite and height of 300.
              ),
//here comes the 2nd container that i want to stack over first one like in picture.
              Positioned(
                top: 50,
                bottom: 0,
                left: 0,
                right: 0,
                child: Container(
                  width: double.maxFinite,
                  height: 500,
                  decoration: BoxDecoration(
                    color: Colors.yellow,
                    borderRadius: BorderRadius.only(topLeft: Radius.circular(25.0), topRight: Radius.circular(25.0)),
                  ),
                ),
              ),
            ],
          ),
      ],
      ),

enter image description here

If anyone can guide me, thanks.

>Solution :

do it as following:

enter image description here

body: Column
children: [
Stack(
//Container A comes here
//Container B comes here wrapped with positioned and top:260, i have set the color to white
),
Container(
//give it the same color as to Container B and give it max height, and add your rest code here),
],

Leave a Reply