I'm new to flutter. I'm creating a login page. but now getting the below error in my code when I add remember me and forget password buttons into a Row Widget to display in one row. how to solve this. for your reference I have attached the full code and UI. login_screen full dart code , login_screen UI image

RenderBox was not laid out: _RenderListTile#c9c23 relayoutBoundary=up24 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1982 pos 12: 'hasSize'

     @override
      Widget build(BuildContext context) {
        return SingleChildScrollView(
          child: Form(
            key: _formKey,
            autovalidateMode: AutovalidateMode.disabled,
            child: Container(
              margin: const EdgeInsets.all(20.0),
              child: Column(
                children: [
                  SizedBox(
                    height: 40,
                  ),
                  TextFormField(
                    controller: emailEditingController,
                    enabled: true,
                    decoration:  InputDecoration(
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(30.0),
                      ),
    
                        hintText: "Email/ Username",
                        hintStyle: TextStyle(
                            color: textGrey, fontFamily: "Dubai", fontSize: 14),
                    ),
                    validator: (String? UserName) {
                      if (UserName != null && UserName.isEmpty) {
                        return "Email can't be empty";
                      }
                      return null;
                    },
                    onChanged: (String? text) {
                      email = text!;
                      // print(email);
                    },
                    onSaved: (value) {
                      loginUserData['email'] = value!;
                    },
                  ),
                  SizedBox(
                    height: 20,
                  ),
                  TextFormField(
                    controller: passwordEditingController,
                    obscureText: _isObscure,
                    enabled: typing,
                    decoration: InputDecoration(
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(30.0),
                        ),
    
                        suffixIcon: IconButton(
                            icon: Icon(_isObscure
                                ? Icons.visibility
                                : Icons.visibility_off),
                            onPressed: () {
                              setState(() {
                                _isObscure = !_isObscure;
                              });
                            }),
                        hintText: "Password",
                        hintStyle: TextStyle(
                            color: textGrey, fontFamily: "Dubai", fontSize: 14)),
                    validator: (String? Password) {
                      if (Password != null && Password.isEmpty) {
                        return "Password can't be empty";
                      }
                      return null;
                    },
                    onChanged: (String? text) {
                      password = text!;
                      //   print(password);
                    },
                    onSaved: (value) {
                      loginUserData['password'] = value!;
                    },
                  ),
    
// this is where I got an error. 
                  Row(
                   // mainAxisAlignment: MainAxisAlignment.start,
                    children: [
    
                      CheckboxListTile(
                        title: const Text(
                          "Remember Me",
                          style: TextStyle(
                              color: textGrey, fontFamily: "Dubai", fontSize: 14),
                        ),
                        value: checkedValue,
                        onChanged: (newValue) {
                          FocusManager.instance.primaryFocus?.unfocus();
                          setState(() {
                            if (isLoading != true) {
                              checkedValue = newValue!;
                              print(newValue);
                            }
                          });
                        },
                        contentPadding: EdgeInsets.only(left: 0, top: 0),
                        controlAffinity:
                        ListTileControlAffinity.leading, //  <-- leading Checkbox
                      ),
    
                      SizedBox(
                        width: 5,
                      ),
                      TextButton(
                        child: Text(
                          "Forget Password",
                          style: TextStyle(
                              color: textGrey, fontFamily: "Dubai", fontSize: 14),
                        ),
                        onPressed: () {
                          //Get.to(ForgetPassword());
                        },
                      )
                    ],
                  ),
    
                  SizedBox(
                    height: 30,
                  ),
                  isLoading
                      ? SpinKitDualRing(
                          color: mainGreen,
                          size: 40,
                        )
                      : GestureDetector(
                          child: MainButton("Login"),
                          onTap: () {
                          
                          },
                        ),
    
                  SizedBox(
                    height: 30,
                  ),
    
                  GestureDetector(
                    child: MainButton("Signup"),
                    onTap: () {
                    },
                  ),
    
                ],
              ),
            ),
          ),
        );
      }

CodePudding user response：

The issue is coming from CheckboxListTile while it is inside the Row,

Wrap CheckboxListTile with Expanded widget, it will get available width inside row.

Row(
  children: [
    Expanded(
      child: CheckboxListTile(

More about Expanded.