flutter - 为同一 Wrap 子项下的不同 textformfields 分配不同的字段输入

Question

我在此处遵循了 有关如何一次验证多个 TextFormField 的颤振文档。但是在这个例子中，所有的文本表单字段都是用相同的输入字段创建的，即名称。我希望可以将不同的字段用于不同的输入，例如姓名、密码、电子邮件等。有人可以帮助解决上述问题吗？

   class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  Widget build(BuildContext context) {
    return Material(
      child: Center(
        child: Shortcuts(
          shortcuts: <LogicalKeySet, Intent>{
            // Pressing enter on the field will now move to the next field.
            LogicalKeySet(LogicalKeyboardKey.enter): NextFocusIntent(),
          },
          child: FocusTraversalGroup(
            child: Form(
              autovalidate: true,
              onChanged: () {
                Form.of(primaryFocus.context).save();
              },
              child: Wrap(
                children: List<Widget>.generate(5, (int index) {
                  return Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: ConstrainedBox(
                      constraints: BoxConstraints.tight(Size(200, 50)),
                      child: TextFormField(
                      decoration: const InputDecoration(
                      icon: Icon(Icons.person),
                  hintText: 'What do people call you?',
                  labelText: 'Name *',
                ),
                onSaved: (String value) {
                // This optional block of code can be used to run
                // code when the user saves the form.
                },
                validator: (String value) {
                return value.contains('@') ? 'Do not use the @ char.' : null;
                },
                      ),
                    ),
                  );
                }),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

标签： flutterdart

Answer 1

使用等作为字段创建一个类hintText，labelText列出该类的实例并将其提供给TextFormField：

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
   
 final List<HintAndLabel> list = const <HintAndLabel>[HintAndLabel(labelText:'Name',hintText:"What do people call you?"),
                                                HintAndLabel(labelText:'label',hintText:"hint"),
                                                HintAndLabel(labelText:'label',hintText:"hint"),
                                                HintAndLabel(labelText:'label',hintText:"hint"),
                                                HintAndLabel(labelText:'label',hintText:"hint")];
   @override
  Widget build(BuildContext context) {
    return Material(
      child: Center(

     child: Shortcuts(
          shortcuts: <LogicalKeySet, Intent>{
            // Pressing enter on the field will now move to the next field.
            LogicalKeySet(LogicalKeyboardKey.enter): NextFocusIntent(),
          },
        
         child: FocusTraversalGroup(
            child: Form(
              autovalidate: true,
              onChanged: () {
                Form.of(primaryFocus.context).save();
              },
              child: Wrap(
                children: List<Widget>.generate(5, (int index) {
                  return Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: ConstrainedBox(
                      constraints: BoxConstraints.tight(Size(200, 50)),
                      child: TextFormField(
                      decoration: InputDecoration(
                      icon: Icon(Icons.person),
                  hintText: list[index].hintText,
                  labelText: list[index].labelText,
                ),
                onSaved: (String value) {
                // This optional block of code can be used to run
                // code when the user saves the form.
                },
                validator: (String value) {
                return value.contains('@') ? 'Do not use the @ char.' : null;
                },
                      ),
                    ),
                  );
                }),
              ),
            ),
          ),
        ),
     ),
    );
  }
}


class HintAndLabel
{
  final String hintText;
  final String labelText;
 const HintAndLabel({this.hintText,this.labelText});
  
}