首页 > 解决方案 > 关闭键盘时 TextFormField 数据消失

问题描述

我正在构建一个颤振应用程序,我在Register那里有一个表格。我正在使用TextFormFields,下面是我的代码。

import 'package:flutter/material.dart';

class RegisterPage extends StatelessWidget {
  final borderColorGreen = const Color(0xff339966);

  TextEditingController nameTxtController =TextEditingController();
  TextEditingController emailTxtController =TextEditingController();
  TextEditingController mobileTxtController =TextEditingController();
  TextEditingController passwordTxtController =TextEditingController();
  TextEditingController confirmPasswordTxtController =TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage("assets/images/background_login_5.jpg"),
            fit: BoxFit.cover,
          ),
        ),
        child: ListView(
          children: <Widget>[
            _buildTitleSection(),
            _buildInputFields("Name",nameTxtController),
            _buildInputFields("Email",emailTxtController),
            _buildInputFields("Mobile",mobileTxtController),
            _buildInputFields("Password",passwordTxtController),
            _buildInputFields("Confirm Password",confirmPasswordTxtController),
            _buildRegisterButton(),
          ],
        ),
      ),
    );
  }

  Widget _buildTitleSection() {
    return Container(
        margin: EdgeInsets.only(top: 40),
        padding: EdgeInsets.all(32),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              "something.xyz",
              style: TextStyle(
                color: borderColorGreen,
                fontWeight: FontWeight.w900,
                fontSize: 25,
              ),
            ),
          ],
        ));
  }

  Widget _buildInputFields(String label, TextEditingController textController) {
    return Container(
        margin: EdgeInsets.only(left: 20, bottom: 20),
        child: Column(
          children: <Widget>[

            Container(
              padding: EdgeInsets.only(right: 20),
              child: Row(
                children: <Widget>[
                  Flexible(
                    child: TextFormField(
                      controller: textController,
                      style: new TextStyle(color: Colors.white),
                      decoration: InputDecoration(
                        labelText: label,
                        fillColor: Colors.white,
                        labelStyle: TextStyle(
                            color: Colors.white, fontWeight: FontWeight.w600),
                        enabledBorder: OutlineInputBorder(
                          borderSide: const BorderSide(
                              color: Colors.white30, width: 2.0),
                          borderRadius: BorderRadius.circular(25.0),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ));
  }





  Widget _buildRegisterButton() {
    return Container(
      margin: EdgeInsets.only(top: 10, right: 20, left: 20),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Flexible(
              child: SizedBox(
                  width: double.infinity, // match_parent
                  child: RaisedButton(
                    child: Text(
                      "Create Account",
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 18,
                          fontWeight: FontWeight.normal),
                    ),
                    shape: RoundedRectangleBorder(
                        borderRadius: new BorderRadius.circular(30.0)),
                    color: borderColorGreen,
                    onPressed: () {},
                  )))
        ],
      ),
    );
  }


}

当我单击 aTextField时,键盘会打开,我可以输入文本。但是,如果我按下手机的后退按钮关闭键盘,那么我从所有字段中输入的文本。我指的是 Android 手机中可用的硬件后退按钮。

该表单是可滚动的,TextField如果我单击另一个TextField,则在输入文本后,文本将保持原样。如果我按下后退按钮关闭键盘,表单中的所有文本都消失了。

我该如何解决这个问题?

标签: androiddartflutterflutter-layout

解决方案


请将您的小部件更改为StatefulWidget,这不会导致控制器重置。

希望有帮助!


推荐阅读