Question

我有一个自定义TextFormField的列表，已将其添加到它们的删除图标我要做的就是当我按下删除按钮时，它将从列表和视图中删除

我尝试向表单字段添加函数失败

我认为我的方法不是实现我想要的东西的最佳方法，我愿意接受任何想法

这是代码

allFit()


import 'package:flutter/material.dart';
typedef DeleteCallback = void Function(Key key);

class DynamicFormField extends  FormField<String>{
  DynamicFormField({
    Key key,
    FormFieldSetter<String> onSaved,
    FormFieldValidator<String> validator,
    String initialValue = "",
    bool autovalidate = false,
    DeleteCallback onDelete(Key key),
  }) : super(
    onSaved: onSaved,
    validator: validator,
    initialValue: initialValue,
    autovalidate: autovalidate,
    builder: (FormFieldState<String> state) {
      return  Row(
          mainAxisSize: MainAxisSize.min,

          children: <Widget>[
            Expanded(
              flex: 5,
              child: TextFormField(
                decoration: const InputDecoration(
          hintText: 'Enter Player Name',
        ),
                onSaved: onSaved,
                validator: validator,
                initialValue: initialValue,
                autovalidate: autovalidate,

                ),
            ),
            IconButton(
            icon: Icon(Icons.delete_outline),
            onPressed: onDelete(key)
          ),
          ],
      );
    }
  );
}

tnx

Answer 1

我使用ListView构建器解决了该问题

import 'package:flutter/material.dart';
import 'package:rummy/models/player.dart';
import 'package:rummy/screens/game_screen.dart';

class NewGame extends StatefulWidget {
  NewGame({Key key}) : super(key: key);

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

class _NewGameState extends State<NewGame> {
  final _formKey = GlobalKey<FormState>();
  List<Widget> fields;
  List<Player> players;
  _NewGameState() {
    players = new List<Player>();
    fields = new List();
    print(players);
    fields.add(generateField());
  }
  Widget generateField() {
    return TextFormField(
      decoration: const InputDecoration(
        hintText: 'Enter Player Name',
      ),
      onSaved: (input) => {players.add(Player(input))},
      validator: (value) {
        if (value.isEmpty) {
          return 'Please enter some text';
        }
        return null;
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SizedBox.expand(
        child: Padding(
          padding: const EdgeInsets.all(12.0),
          child: Column(
            children: <Widget>[
              Form(
                  key: _formKey,
                  child: Expanded(
                    child: ListView(
                      children: <Widget>[
                        SizedBox(
                          height: MediaQuery.of(context).size.height,
                          child: Builder(
                            builder: (BuildContext context) {
                              return ListView.builder(
                                scrollDirection: Axis.vertical,
                                shrinkWrap: true,
                                itemCount: fields.length,
                                itemBuilder:
                                    (BuildContext context, int postion) {
                                  return Row(
                                    mainAxisSize: MainAxisSize.min,
                                    children: <Widget>[
                                      Expanded(
                                        child: fields[postion],
                                      ),
                                      IconButton(
                                          icon: Icon(Icons.delete_outline),
                                          onPressed: () => {
                                                setState(() {
                                                  print(postion);
                                                  fields.removeAt(postion);
                                                })
                                              }),
                                    ],
                                  );
                                },
                              );
                            },
                          ),
                        )
                      ],
                    ),
                  )),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  RaisedButton(
                    onPressed: () {
                      print("asdasd");
                      if (_formKey.currentState.validate()) {
                        players.clear();
                        _formKey.currentState.save();
                        Navigator.push(
                            context,
                            MaterialPageRoute(
                              builder: (context) => GameScreen(players),
                            ));
                      } else
                        print(_formKey.currentState.validate());
                    },
                    child: Text('Submit'),
                  ),
                  RaisedButton(
                    onPressed: () {
                      setState(() {
                        fields.add(generateField());
                      });
                    },
                    child: Text('Add New Player'),
                  ),
                ],
              ),
            ],
            mainAxisAlignment: MainAxisAlignment.center,
          ),
        ),
      ),
    );
  }
}

我用这个 https://github.com/MobMaxime/Flutter-To-Do-App/blob/master/lib/screens/todo_list.dart

从窗口小部件内的印刷机中从列表中删除窗口小部件

1 个答案: