首页 > 解决方案 > 使用 CupertinoDatePicker 时无法保持在键盘上方

问题描述

我在一列中有一些 textFormFields,为了避免底部溢出错误并在键盘上方自动滚动,我将它放在 SingleChildScrollView 中。

我添加了 CupertinoDatePicker 并出现RenderFlex object was given an infinite size during layout错误。

我可以解决的唯一方法是将日期选择器放在一个大小合适的盒子里

Widget _buildDatetime() {
  return SizedBox(
    height:200,
    child:
    CupertinoDatePicker(
    mode: CupertinoDatePickerMode.time,
    minuteInterval: 1,
    minimumDate: DateTime.now().subtract(Duration(days:1)),
    initialDateTime: DateTime.now(),
    onDateTimeChanged: (DateTime newdate) {
      print(newdate);
      //scrollController.animateTo(180.0,
     //     duration: Duration(milliseconds: 500), curve: Curves.ease);
    },
  )
  );
}

现在 SingleChildScrollView 不会在键盘上方滚动我的提交按钮,resizeToAvoidBottomInset也不起作用。

我猜它与日期选择器的固定大小有关,但我找不到解决方法。

这是我的整个脚手架-

return Scaffold(
        body: Container(
          color: Color.fromRGBO(255, 255, 255, 1),
          padding: const EdgeInsets.symmetric(horizontal: 43.0),
          child: Form(
            key: _formKey,
            child: Container(
              alignment: Alignment.center,
              child: SingleChildScrollView( // new line
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      _buildFirstName(),
                      _buildSurname(),
                      _buildEmail(),
                      _buildPhone(),
                      _buildTableNumber(),
                      _buildDatetime(),
                      _buildSignUpButton(context)
                    ],
                  ),
              ),
            ),
          ),
        ));

标签: flutter

解决方案


您可以尝试paddingSingleChildScrollView.

return Scaffold(
        body: Container(
          color: Color.fromRGBO(255, 255, 255, 1),
          padding: const EdgeInsets.symmetric(horizontal: 43.0),
          child: Form(
            key: _formKey,
            child: Container(
              alignment: Alignment.center,
              child: SingleChildScrollView( // new line
                  padding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom), //ADD PADDING HERE
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      _buildFirstName(),
                      _buildSurname(),
                      _buildEmail(),
                      _buildPhone(),
                      _buildTableNumber(),
                      _buildDatetime(),
                      _buildSignUpButton(context)
                    ],
                  ),
              ),
            ),
          ),
        ));

希望这会有所帮助。


推荐阅读