0

我正在尝试使用 Flutter 的登录页面。目前它看起来像这样:

打开键盘之前

当我尝试使用屏幕键盘输入其中一个文本字段时,颤动会尝试将我的所有内容向上移动,直到显示“TEST”的图像到达顶部并且底部内容溢出:

打开键盘后

我见过的其他应用程序允许内容继续在屏幕“上方”移动,并且不会在顶部小部件到达屏幕顶部时停止。

我知道我可以通过设置为 false 来禁用脚手架中这些小部件的大小调整和移动,resizeToAvoidBottomInset但这看起来并不太好,并且会根据键盘覆盖不同的数量,所以我宁愿不这样做。

我怎样才能让小部件继续向上移动?此外,是否有办法阻止“创建帐户”小部件像其他小部件一样移动并将其保留在键盘下方?我试过查看颤振的文档,但我真的不知道如何描述这个问题以获得有用的结果,因为我对颤振还是很陌生。

“创建帐户”按钮固定在屏幕底部的单独列中,其余小部件位于包含另一列的展开小部件中。这两列都被父列包围。这是我的小部件树,以防它有用:

  @override
  Widget build(BuildContext context) {

    return new WillPopScope(
      onWillPop: () async => false,
      child: Scaffold(
        backgroundColor: Colors.white,
        body: Column(children: <Widget>[
          Expanded(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Image.asset(
                  "lib/assets/test.png",
                  height: 20.h,
                  width: 20.h,
                ),
                SizedBox(height: 10.h),
                Text(
                  "Login:",
                  style: TextStyle(
                    fontSize: 16.sp,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                SizedBox(height: 1.5.h),
                RoundedInputField(
                  editTextBackgroundColor: Colors.blue[300],
                  hintText: "Email:",
                  autoFocus: false,
                  onChanged: (value) {
                    
                  },
                ),
                RoundedPasswordField(
                  editTextBackgroundColor: Colors.blue[300],
                  onChanged: (value) {
                    
                  },
                  onSubmitted: (value) {
                    
                  },
                ),
                SizedBox(height: 0.75.h),
                Text(
                  "$errMsg",
                  style: TextStyle(
                    fontSize: 13.sp,
                    fontWeight: FontWeight.normal,
                    color: Colors.red,
                  ),
                ),
                SizedBox(height: 0.75.h),
                RoundedButton(
                  text: "Login!",
                  height: 6.h,
                  color: Colors.blue,
                  textColor: Colors.white,
                  press: () {
                    
                  },
                ),
              ],
            ),
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.end,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Align(
                alignment: Alignment.bottomCenter,
                child: ElevatedButton(
                  style: ElevatedButton.styleFrom(primary: Colors.blue, textStyle: TextStyle(color: Colors.white, fontWeight: FontWeight.bold), fixedSize: Size(100.w, 10.h),),
                  child: Text("Create Account"),
                  onPressed: () {
                    
                    }
                  },
                ),
              ),
            ],
          ),
        ]),
      ),
    );

如果有人可以提供帮助,将不胜感激。

4

1 回答 1

1

你应该用以下方式包裹你的身体SingleChildScrollView

例子:

@override
  Widget build(BuildContext context) {

    return new WillPopScope(
      onWillPop: () async => false,
      child: Scaffold(
        backgroundColor: Colors.white,
        body: Container(
        child: SingleChildScrollView(
        child: Column(...)
        ),
       ),
      ),
    );
于 2021-07-05T19:34:40.750 回答