Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter Radio button text "kg" align problem?

IMAGE LINK

As you can see in above picture "kg" text has huge gap. but the height text field widget is perfect. And it shows the following error.

Exception caught by widgets library

Incorrect use of ParentDataWidget.

Kindly let me know what is the problem

(I'm new to flutter)

      Material(
      elevation: 30.0,
      shadowColor: Colors.grey,
      child: Container(
        height: 100,
        width: 375,
        decoration: BoxDecoration(
          border: Border.all(
            color: Colors.blue,
          ),           
        ),
        alignment: Alignment.topCenter,
        child: SizedBox(
          height: 300,
          width: 500,
          child: Expanded(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                SizedBox(
                  width: 300,
                  child: SingleChildScrollView(
                    child: TextField(                         
                      controller: weightcon,
                      style: TextStyle(
                        color: Colors.black,
                        fontSize: 30,
                      ),
                      decoration: InputDecoration(
                        border: OutlineInputBorder(),
                        hintText: 'Weight',
                        focusedBorder: OutlineInputBorder(
                          borderRadius: 
                           BorderRadius.circular(0.0),
                          borderSide: BorderSide(
                            color: Colors.black,
                            width: 2.0,
                          ),
                        ),             
                        enabledBorder: OutlineInputBorder(
                          borderRadius: 
                           BorderRadius.circular(0.0),
                          borderSide: BorderSide(
                            // color: Colors.redAccent[100],
                            color: Colors.black54,
                            width: 2.0,
                          ),
                        ),
                      ),
                      onChanged: (weightval) {
                        print('First text field: $weightval');
                        globals.weightvalue = 
                       double.parse(weightval);
                      },
                    ),
                  ),
                ),
                SizedBox(
                  width: 5,
                ),
                Container(
                  height: 130,
                  width: 30,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      SizedBox(
                          width: 30,
                          height: 50,
                          child: Flexible(
                            child: SizedBox(
                                child: Radio(
                              value: 0,
                              groupValue: 1,
                              onChanged: (value) {},
                            )),
                          )),
                      SizedBox(
                        width: 30,
                      ),
                      SizedBox(
                          child: Flexible(
                        child: Text("KG"),
                      ),),
                      Flexible(
                        child: SizedBox(
                            width: 30,
                            height: 25,
                            child: Radio(
                              value: 1,
                              groupValue: 1,
                              onChanged: (value) {},
                            )),
                      ),
                      SizedBox(
                        width: 30,
                      ),
                      SizedBox(
                          child: Flexible(
                        child: Text("LB"),
                      ),),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    ),
like image 961
Thiroshan Suthakar Avatar asked Dec 21 '25 10:12

Thiroshan Suthakar


2 Answers

Remove the height for sizedbox of radioButton, height takes the extra space

Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: <Widget>[
                          SizedBox(
                              width: 30,
                              child: Flexible(
                                child: SizedBox(
                                    child: Radio(
                                  value: 0,
                                  groupValue: 1,
                                  onChanged: (value) {},
                                )),
                              )),
                          SizedBox(
                            width: 30,
                          ),
                          SizedBox(
                              child: Flexible(
                            child: Text("KG"),
                          ),),
                          Flexible(
                            child: SizedBox(
                                width: 30,
                                child: Radio(
                                  value: 1,
                                  groupValue: 1,
                                  onChanged: (value) {},
                                )),
                          ),
                          SizedBox(
                            width: 30,
                          ),
                          SizedBox(
                              child: Flexible(
                            child: Text("LB"),
                          ),),
                        ],
                      ),
                    ),
                  ],
                ),

Output

enter image description here

like image 148
Jahidul Islam Avatar answered Dec 23 '25 02:12

Jahidul Islam


You used the Expanded Widget the wrong way! It must be the children of a Flex Widget (Row, Column, ListView, GridView, Wrap,...). As you can see, you wrote:

Expanded(
child: Row( // this is where the error pointing at
),
),

So to fix it, remove that Expanded Widget and use it as parent of the widgets in side the Row Widget. This is an example:

Row(
children: [
  Expanded( // Expanded Widget inside children parameter of Row Widget
child: Widget1(),
),
Expanded(
child: Widget2(),
),
],
),
like image 24
Trần Trung Hiếu Avatar answered Dec 23 '25 04:12

Trần Trung Hiếu