首页 > 解决方案 > Flutter:出现键盘时向上滚动屏幕

问题描述

我正在尝试构建一个登录屏幕,其中包含顶部的电话号码字段以及底部的图像和登录按钮,一旦我点击电话号码字段键盘升起但我的“登录按钮”隐藏在键盘后面,我已使用“SingleChildScrollView”,以便当键盘上升时页面变为可滚动但登录按钮不会出现在键盘顶部。

这是代码片段:

return Scaffold(
  backgroundColor: white.color,
  body: SingleChildScrollView(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
                  Container(
                        child: Text(
                          'Enter your mobile number',
                          style: TextStyle(
                            fontSize: headSize.fontSize,
                            fontWeight: FontWeight.w400,
                            color: black.color,
                            fontFamily: 'ProductSans',
                          ),
                        ),
                      ),
                      Container(
                        height: screenHeight / 15,
                        child: Center(
                          child: SizedBox(
                            height: screenHeight / 6,
                            width: double.infinity,
                            child: RaisedButton(
                              color: indigo.color,
                              shape: borderRadius,
                              child: Text(
                                "Continue",
....

标签: flutterdart

解决方案


尝试用screenHeight / 15 and screenHeight / 6例如 100 替换并检查结果。

Container(
          height: screenHeight / 15,
          child: Center(
            child: SizedBox(
              height: screenHeight / 6,
              width: double.infinity,
              child: RaisedButton(
                color: indigo.color,
                shape: borderRadius,
                child: Text(
                  "Continue",

顺便说一句,您将父级的高度设置为小于子级。我想知道为什么?:)

例如,如果 screenHeight = 100

100/15 = 6.6 父母

100/6 = 16.6 孩子


推荐阅读