RenderBox 未布局：颤动错误

Question

我是新来的扑腾。我正在创建一个登录页面。但现在，当我将“记住我”和“忘记密码”按钮添加到行小部件中以显示在一行中时，我的代码中出现以下错误。如何解决这个问题。我附上了完整的代码和用户界面供您参考。login_screen 完整 dart 代码， login_screen UI 图像

RenderBox 未布局：_RenderListTile#c9c23 relayoutBoundary=up24 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart'：断言失败：第 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: () {
                    },
                  ),
    
                ],
              ),
            ),
          ),
        );
      }

Answer 1

问题来自CheckboxListTile于Row,

CheckboxListTile用小部件包裹Expanded，它将获得行内的可用宽度。

Row(
  children: [
    Expanded(
      child: CheckboxListTile(

更多关于Expanded。