Question 255591 in Flutter Question posted in
The official Flutter documentation can be found here.

failing to draw container inside container in flutter

A very simple drawing i want to draw …

Three nested container…Big Medium and small…but i am not getting what i want..

if i wrap container inside center widget..works fine..but what without center widget.

return Scaffold(
      body: Center(child: Container(
        height: 200,
        width: 200,
        decoration: buildDecoration(Colors.red),
        child: Container(
          height: 100,
          width: 100,
          decoration: buildDecoration(Colors.green),
          child: Container(
            height: 50,
            width: 50,
            decoration: buildDecoration(Colors.blue),
          ),
        ),
      ),),
    )
Tags:

2

Answers


  1. 0

    Use this code snipped, You need to add Row or Column

    Container(
              height: 200,
              width: 200,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(15),
                color: Colors.red,
              ),
              child: Column(
                children: [
                  Container(
                    height: 100,
                    width: 100,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(15),
                      color: Colors.green,
                    ),
                    child: Row(
                      children: [
                        Container(
                          height: 50,
                          width: 50,
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(15),
                            color: Colors.blue,
                          ),
                        ),
                      ],
                    ),
            ),
                ],
              ),
            ),
    Login or Signup to reply.
  2. 0

    You can provide alignment on Container, it will provide you the output.

    return Scaffold(
  body: Center(
    child: Container(
      height: 200,
      width: 200,
      alignment: Alignment.center,
      decoration: buildDecoration(Colors.red),
      child: Container(
        height: 100,
        width: 100,
        alignment: Alignment.center,
        decoration: buildDecoration(Colors.green),
        child: Container(
          height: 50,
          width: 50,
          decoration: buildDecoration(Colors.blue),
        ),
      ),
    ),
  ),
);

    And make sure to check more about layout/constraints.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search