首页 > 解决方案 > My second container is taking all the space.How to avoid that

问题描述

enter image description here

The second Container which is in the red color is taking all the remaining space. How to avoid that. I want my second container to take the minimum space.

        Container(
        height: 600,
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.all(
            Radius.circular(60),
          ),
        ),
        child: Padding(
          padding: const EdgeInsets.only(top: 80.0, right: 50, left: 50),
          child: Container(

            decoration: BoxDecoration(
              color: Colors.red,
              borderRadius: BorderRadius.all(
                Radius.circular(20),
              ),
            ),
            child: Column(
              children: [
                TextFormField(
                  decoration: const InputDecoration(
                      border: UnderlineInputBorder(),
                      labelText: "Email or Phone Number"),
                ),
                SizedBox(
                  height: 20,
                ),
                TextField(
                  decoration:
                      new InputDecoration.collapsed(hintText: 'PassWord'),
                )
              ],
            ),
          ),
        ),
      ),[![][1]][1]

标签: flutterflutter-layout

解决方案


Try below code hope its helpful to you. Just remove your container extra/large height

  Container(
  height: 180,
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.all(
      Radius.circular(
        60,
      ),
    ),
  ),
  child: Padding(
    padding: const EdgeInsets.only(top: 80.0, right: 50, left: 50),
    child: Container(
      decoration: BoxDecoration(
        color: Colors.red,
        borderRadius: BorderRadius.all(
          Radius.circular(20),
        ),
      ),
      child: Column(
        children: [
          TextFormField(
            decoration: const InputDecoration(
              border: UnderlineInputBorder(),
              labelText: "Email or Phone Number",
            ),
          ),
          SizedBox(
            height: 20,
          ),
          TextField(
            decoration: InputDecoration.collapsed(
              hintText: 'PassWord',
            ),
          )
        ],
      ),
    ),
  ),
),

Your result screen-> image


推荐阅读