Question

我有一个小部件，它有一个图像元素和表单元素的扩展列表视图，当我填写并滚动数据时它会在图像后面滚动时消失。我在调试时没有抛出任何错误，它发生在滚动窗口小部件顶部图像后面的任何字段上。有什么想法吗？

@override
  Widget build(BuildContext context) {
    var _children = <Widget>[
      new Center(
        child: new Text(widget.prov.fname + widget.prov.lname,
          style: new TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
        ),
      ),
      new Center(
          child: new Container(
            padding: new EdgeInsets.only(
                left: 125.0, right: 125.0, bottom: 50.0),
            child: new Image.network('http://$baseurl:8080/getimage/'+widget.prov.pic.assetName),
          )
      ),

      new Form(
          key: _formKey,
          autovalidate: _autovalidate,
          onWillPop: _warnUserAboutInvalidData,
          child: new Expanded(
              child: new ListView(
                padding: const EdgeInsets.symmetric(horizontal: 16.0),
                children: <Widget>[
                  new TextFormField(
                    decoration: const InputDecoration(
                      icon: const Icon(Icons.person),
                      hintText: 'First Name?',
                      labelText: 'First Name *',
                    ),
                    onSaved: (String value) { referral.fname = value; },
                    validator: _validateName,
                  ),

                  new TextFormField(
                    decoration: const InputDecoration(
                      icon: const Icon(Icons.person),
                      hintText: 'Last Name?',
                      labelText: 'Last Name *',
                    ),
                    onSaved: (String value) { referral.lname = value; },
                    validator: _validateName,
                  ),

                  new TextFormField(
                    decoration: const InputDecoration(
                        icon: const Icon(Icons.phone),
                        hintText: 'How to contact?',
                        labelText: 'Phone Number *',
                        prefixText: '+1'
                    ),
                    keyboardType: TextInputType.phone,
                    onSaved: (String value) { referral.contact = value; },
                    validator: _validatePhoneNumber,
                    // TextInputFormatters are applied in sequence.
                    inputFormatters: <TextInputFormatter> [
                      WhitelistingTextInputFormatter.digitsOnly,
                      // Fit the validating format.
                      _phoneNumberFormatter,
                    ],
                  ),

                  new TextFormField(
                    decoration: const InputDecoration(
                      hintText: 'Tell us about patient',
                      helperText: 'It does not have to be detailed yet',
                      labelText: 'Referral Details',
                    ),
                    maxLines: 5,
                  ),

                  new _DateTimePicker(
                    labelText: 'DOB',
                    selectedDate: _fromDate,
                    selectDate: (DateTime date) {
                      setState(() {
                        referral.dob = date;
                      });
                    },
                  ),

                  new InputDecorator(
                    decoration: const InputDecoration(
                      labelText: 'Type of Appointment',
                      hintText: 'Choose an Appointment Type',
                    ),
                    isEmpty: _typeAppt == null,
                    child: new DropdownButton<String>(
                      value: _typeAppt,
                      isDense: true,
                      onChanged: (String newValue) {
                        setState(() {
                          _typeAppt = newValue;
                        });
                      },
                      items: _allTypeAppt.map((String value) {
                        return new DropdownMenuItem<String>(
                          value: value,
                          child: new Text(value),
                        );
                      }).toList(),
                    ),
                  ),

                ],

              )
          )
      ),

      /*new RefreshIndicator(
        child: new ListView.builder(
          itemBuilder: _itemBuilder,
          itemCount: listcount,
        ),
        onRefresh: _onRefresh,

      ),*/

    ];
    return new Scaffold(
      appBar: new AppBar(title: new Text("My Provider")),
      body: new Column(
        children: _children,
      ),
    );
  }

Answer 1

这是因为您正在使用ListView渲染孩子。 ListView仅呈现可见的子级（具有回收性质）。而是将Column与SingleChildScrollView一起使用。

SingleChildScrollView(child:Column(children:yourFormChildren));

Answer 2

我认为问题在于您没有保存放入TextFields的值（例如状态）。
从您的代码我假设您使用ListView.builder（）来设置ListView。如documentation中所述，此方法仅呈现视图中的子项。将子项滚动到视图外后，它将从ListView中删除，只有在将其滚动到视图中后才会再次添加。由于删除了TextField，因此也会删除该值。

要永久保存值，我建议使用TextFields并将输入保存到TextField的onChanged()方法中，或者使用TextEditingController。

Answer 3

使用TextEditorController非常简单：

对于“名字”，添加==>

TextEditingController nameController = new TextEditingController();

和

`new TextFormField(
         decoration: const InputDecoration(
           icon: const Icon(Icons.person),
           hintText: 'First Name?',
           labelText: 'First Name *',
          ),
         validator: _validateName,
         controller: nameController,
 ),`

在您的onSubmit（）==>

print(nameController.text)

当我滚动时，颤动的表格数据消失了

3 个答案: