TextFormField 工作不正常，不断闪烁

Question

TextFormField 无法正常工作，它不断闪烁并且不允许我写任何东西，当我点击 TextFormField 时，我的键盘会出现一秒钟然后立即消失。我很困惑我的代码做错了什么，我已经将我的代码与以前的工作代码相匹配，但仍然出现这种行为。

这是我的代码。

class ComingSoonState extends State<ComingSoon> {

String language;

  TextEditingController _textEdititingController ;

@override
void initState() {
_textEdititingController = new TextEditingController(); //Initialised TextEditingController
super.initState();
}

@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final Size size = MediaQuery.of(context).size;

final formData = new Form(
  key: widget._formKey,
  child: new Container(
    padding: const EdgeInsets.only(
        left: 35.0,
        right: 35.0),
    child: new Column(

      children: <Widget>[


        new Theme(
          data: theme.copyWith(primaryColor: Colors.black54),
          child: new TextFormField(
              controller: _textEdititingController, //ADDED CONTROLLER HERE
              style: const TextStyle(color: Colors.black54),
              decoration: new InputDecoration(

                  labelText: 'Amount',
                  labelStyle: const TextStyle(color: Colors.black54)
              ),
              // validator: this._validateEmail,
              validator: (val) {
                return val.isEmpty
                    ? "Please enter amount"
                    : null;
              },
              onSaved: (String value) {
                // this._data.email = value;
                this.language = value;
              }
          ),
        ),



      ],
    ),
  ),
);
return Scaffold(

  appBar: new AppBar(
    leading: null,
    title: const Text('Send Money', style: const TextStyle(
        color: Colors.white
    ),

    ),
  ),
  body: new Container(

    color: Colors.grey[300],
    child: new ListView(
      children: <Widget>[
        new Container(
            child: new Column(
              children: <Widget>[
                new Container(
                  height: 60.0 ,
                  padding: const EdgeInsets.all(5.0),
                  child: new Card(
                    child: new Row(
                      children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.only(left: 8.0),
                          child: new Text("Available  balance  in  wallet", style:
                          new TextStyle(color: Colors.black54,
                              fontSize: 16.0
                          ),),
                        ),
                        Padding(
                          padding: const EdgeInsets.only(left: 8.0),
                          child: new Text("123 KSH", style:
                          new TextStyle(color: Colors.blueAccent,
                              fontSize: 16.0
                          ),),
                        ),

                      ],
                    ),
                  ),
                ) ,

                new Container(
                  //height: 300.0,
                  padding: const EdgeInsets.all(5.0),
                  child: new Card(
                    child: new Container(
                      child: new Center(
                        child: new Column(
                          children: <Widget>[

                            formData
                          ],
                        ),
                      ),
                    ),
                  ),
                )
              ],
            )
        ),
      ],
    ),
  ),
);
}
}

Answer 1

我添加了一个浮动操作按钮，该按钮显示一个对话框，显示您在TextField 中输入的内容（使用控制器）。我不确定您之前传入的表单键是什么，但将 GlobalKey 实例设为成员变量可以消除键盘出现/关闭问题。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  String language;
  TextEditingController _textEditingController;
  final _formKey = GlobalKey<FormState>();

  @override
  void initState() {
    _textEditingController =
        TextEditingController(); //Initialised TextEditingController
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final Size size = MediaQuery.of(context).size;

    final formData = Form(
      key: _formKey,
      child: Container(
        padding: const EdgeInsets.only(left: 35.0, right: 35.0),
        child: Column(
          children: <Widget>[
            Theme(
              data: theme.copyWith(primaryColor: Colors.black54),
              child: TextFormField(
                  controller: _textEditingController,
                  //ADDED CONTROLLER HERE
                  style: const TextStyle(color: Colors.black54),
                  decoration: InputDecoration(
                      labelText: 'Amount',
                      labelStyle: const TextStyle(color: Colors.black54)),
                  // validator: this._validateEmail,
                  validator: (val) {
                    return val.isEmpty ? "Please enter amount" : null;
                  },
                  onSaved: (String value) {
                    // this._data.email = value;
                    language = value;
                  }),
            ),
          ],
        ),
      ),
    );
    return Scaffold(
      appBar: AppBar(
        leading: null,
        title: const Text(
          'Send Money',
          style: const TextStyle(color: Colors.white),
        ),
      ),
      body: Container(
        color: Colors.grey[300],
        child: ListView(
          children: <Widget>[
            Container(
                child: Column(
              children: <Widget>[
                Container(
                  height: 60.0,
                  padding: const EdgeInsets.all(5.0),
                  child: Card(
                    child: Row(
                      children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.only(left: 8.0),
                          child: Text(
                            "Available  balance  in  wallet",
                            style: TextStyle(
                                color: Colors.black54, fontSize: 16.0),
                          ),
                        ),
                        Padding(
                          padding: const EdgeInsets.only(left: 8.0),
                          child: Text(
                            "123 KSH",
                            style: TextStyle(
                                color: Colors.blueAccent, fontSize: 16.0),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                Container(
                  //height: 300.0,
                  padding: const EdgeInsets.all(5.0),
                  child: Card(
                    child: Container(
                      child: Center(
                        child: Column(
                          children: <Widget>[formData],
                        ),
                      ),
                    ),
                  ),
                )
              ],
            )),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        // When the user presses the button, show an alert dialog with the
        // text the user has typed into our text field.
        onPressed: () {
          return showDialog(
            context: context,
            builder: (context) {
              return AlertDialog(
                // Retrieve the text the user has typed in using our
                // TextEditingController
                content: Text(_textEditingController.text),
              );
            },
          );
        },
        tooltip: 'Show me the value!',
        child: Icon(Icons.text_fields),
      ),
    );
  }
}