Question

Sign up form with flutter

我正在尝试使用flutter构建应用程序前端，这是我的第一次，因此我遇到了类似这样的错误：由于我将表单元素放在了listview中，所以无法编辑textformfield！当键盘显示要在该字段中输入一些文本时，它会在一秒钟内消失！我需要立即解决方案:(

import 'package:flutter/material.dart';
import'package:dubai274_app/mobile_verif.dart';
import 'EnsureVisible.dart';
class SignUp extends StatefulWidget{
  static String tag = 'Sign_up-page';
  SignUp_Page createState() => SignUp_Page();

}
class SignUp_Page extends State<SignUp>{



  List<DropdownMenuItem<String>> _Dropdownmenuitems;
  String _statusSel;
  List<DropdownMenuItem<String>> _getDropdownmenuitem(){

    List<DropdownMenuItem<String>> items=new List();
    items.add(new DropdownMenuItem(value:'Emirates',child: new Text('United Arab Emirates')));
    items.add(new DropdownMenuItem(value:'Tun',child: new Text('Tunisia')));
    return items;
  }
  void changeddropdowselecteditem(String selecteditem){
    setState(() {
_statusSel=selecteditem;
    });
  }
   @override
  void initState() {
    // TODO: implement initState
    //listViewController=new ScrollController().addListener(_scrollListener);
    _Dropdownmenuitems=_getDropdownmenuitem();
    _statusSel=_Dropdownmenuitems[0].value;
  }
@override
  Widget build(BuildContext context) {
  final scaffoldKey = GlobalKey<ScaffoldState>();
  final formKey = GlobalKey<FormState>();
  final TextEditingController _controller = new TextEditingController();

final first_value=TextFormField(autofocus: false,
  validator: (val) =>
  val.length < 6 ? 'First name required' : null,
  decoration: InputDecoration(
    labelText: 'First Name',
    hintText: 'First Name',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),


  ),);

final family_value=TextFormField(autofocus: false,
  decoration: InputDecoration(
    labelText: 'Last Name',
    hintText: 'Last Name',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),


  ),);

final Nationality=new DropdownButton(items: _Dropdownmenuitems, value:_statusSel,onChanged: changeddropdowselecteditem);

final email_value=TextFormField(keyboardType: TextInputType.emailAddress,
  autofocus: false,
  decoration: InputDecoration(
    labelText: 'Email',
    hintText: 'Email',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),

  ),);

final password=Column(children: <Widget>[ TextFormField(autofocus: false,

  obscureText: true,
  decoration: InputDecoration(
    labelText: 'Password',
    hintText: 'Password',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),)), Text('Min 8 characters with at least one special character')]);
  void _performsignup() {

    final snackbar = SnackBar(
      content: Text('Email: $email, password: $password'),
    );

    scaffoldKey.currentState.showSnackBar(snackbar);
  }
  void _submit() {
    final form = formKey.currentState;

    if (form.validate()) {
      form.save();
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => MobileVerif()),
      );

      _performsignup();
    }
  }
final forward_signedin=FloatingActionButton(tooltip: 'Go forward',
  child: Icon(Icons.arrow_forward,color: Colors.white,size: 38.4,),


  onPressed: (){_submit();},);

return MaterialApp(
      title: 'Sign_Up_Page',
      home: Scaffold(
        appBar: AppBar(
          elevation: 0.0,
      backgroundColor: Colors.transparent,
      title: const Text('Sign Up',style: TextStyle(color: Colors.blueAccent, fontSize: 25.0,fontWeight: FontWeight.bold),textAlign: TextAlign.center,),
  centerTitle: true,
  leading: IconButton(
  tooltip: 'Previous choice',
  icon: const Icon(Icons.arrow_back_ios),
    onPressed: () { Navigator.pop(context);},
    color: Colors.black,
    iconSize: 20.0,
  ),
  ),
        body: new Container(
          decoration: new BoxDecoration(
          image: new DecorationImage(
            image: new AssetImage("assets/background.png"),
            fit: BoxFit.cover,
          ),
        ),
        child: new Form( key: formKey,
            child: new Padding( padding: new EdgeInsets.all(40.0), child: ListView(
      children: <Widget>[

       first_value,
       family_value,
       Nationality,
       email_value,
       password,
       new ListTile( title:forward_signedin,)],
)) )

        ),


        ),

      );


  }
}

Answer 1

我看到您已经在build函数中声明了formkey。
它应该在构建函数之外。结帐here

Answer 2

如果您使用的是StatelessWidget，请将其转换为StatefulWidget。确保键是状态的属性，而不是小部件的属性。发生这种情况是因为每次重新构建都会一次又一次地重新创建表单密钥。要保留密钥，它应该是状态的一部分。

Answer 3

我遇到了同样的问题，就像@apc所说的那样，只需将密钥设为静态或将其初始化为iniState()...

如果您使用无状态窗口小部件，请将其设为静态

static final GlobalKey<FormState> _key = GlobalKey<FormState>();

Answer 4

在我自己的情况下，我将此 key: ValueKey<int>(math.Random().nextInt(5)), 作为 TextFormField 的祖先小部件的键。我删除了它，错误不再出现。所以我的调试建议是检查小部件树中的所有小部件，这些小部件为其 key 参数传递了任何值..

Answer 5

您的构建函数中包含以下代码：

final formKey = GlobalKey<FormState>();

这是问题所在。您必须将其设为静态或移至 initState()

Answer 6

我将在这里发布我的答案，即使它与OP的问题并不完全相同。

我在互联网上下搜索了键盘出现和消失的问题，并且
1.这是我发现的唯一一个描述键盘出现消失问题的SO问题，并且
2.那里的其他解决方案，例如@apc's answer和此github answer都集中在formKey和{或static上，绝对不是造成我问题的原因（对于表单和/或其字段，不变的键或重新创建的键对问题完全没有影响。）

我的具体问题涉及到GlobalKey和许多class AuthService with ChangeNotifier方法。
经过数天的尝试，我发现可以避免键盘出现并立即消失的“ 唯一方法”是{{1 }}位于我应用的最高级别，位于Future中：

AuthService()

（在代码中的其他任何地方runApp()都有键盘消失的问题）

然后，我必须在这种情况下如何构造逻辑方面变得很有创意-因为我只真正在我的应用程序的某些部分中关心AuthService，但是我对Flutter还是很陌生，这一切都是很好的学习。

我不知道为什么会这样，我想学习更多，而且我知道我还没有阐明我的全部情况。但是我花了几天的时间解决了这个问题，我需要把答案放在这里，希望对其他人有所帮助。

Answer 7

您应该定义所有这些：

{{property}}

作为SignUp_Page的字段不在构建功能中。

Flutter：编辑我的文本字段时，键盘立即消失

7 个答案: