Flutter 如何从颤振中使用一种方法创建的多个文本字段中检索值？

我已经在不同的文件中使用一个方法创建了多个文本字段，我是如何从中检索值的。我想检索不同变量中的值

//class method

class CustomTextField {
  static TextField display(BuildContext context, [String name, double size=16,IconData icon]) {
    return new TextField(
      textAlign: TextAlign.center,
      style: CustomTextStyle.display(context, Colors.black38, size),
      decoration: new InputDecoration(
        alignLabelWithHint: true,
        icon: new Icon(icon),
        contentPadding:EdgeInsets.only(top: 30,right: 30,),
        border: InputBorder.none,
        hintText:"$name",
        focusedBorder: InputBorder.none,
        hintStyle: CustomTextStyle.display(context, Colors.grey, size),
      ),
    );
  }
}

//call method

 new Container(
          width: width,
          height: height,
          decoration: new BoxDecoration(
            borderRadius: new BorderRadius.all(Radius.circular(20)),
            gradient: new LinearGradient(
              colors: [
                Color.fromRGBO(252, 191, 93, 1),
                Color.fromRGBO(255, 210, 119, 1),
                Color.fromRGBO(252, 215, 85, 1),
              ],
              begin: Alignment.bottomCenter,
              end: Alignment.topCenter,
            ),
          ),
          child: CustomTextField.display(context, name,16,icon),
        ),

---

您应该提供一个函数来处理自定义文本字段的

onChange

属性

以下是我在一个项目中如何使用的：

自定义类小部件

class MyTextField extends StatefulWidget {
  final String title;
  final Function onChange; // you can get the value from this function
  final bool isPassword;

  MyTextField(this.title, this.onChange, {this.isPassword = false});

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

class _MyTextFieldState extends State<MyTextField> {
  bool showPassword = false;
  final _controller = TextEditingController();

  @override
  Widget build(BuildContext context) {
    _controller.addListener(() {
      setState(() {});
    });
    return Container(
      margin: EdgeInsets.symmetric(vertical: 10),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            widget.title,
            style: TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 15,
            ),
          ),
          SizedBox(height: 2),
          TextField(
            controller: _controller,
            onChanged: widget.onChange,
            obscureText: !showPassword && widget.isPassword,
            decoration: InputDecoration(
                suffixIcon: widget.isPassword
                    ? IconButton(
                        icon: Icon(
                          Icons.remove_red_eye,
                          color: showPassword ? Colors.blue : Colors.grey,
                        ),
                        onPressed: () {
                          setState(() => showPassword = !showPassword);
                        },
                      )
                    : IconButton(
                        icon: Icon(
                          Icons.clear,
                          color: _controller.text.isEmpty
                              ? Colors.grey
                              : Colors.blue,
                        ),
                        onPressed: () => _controller.clear()),
                border: InputBorder.none,
                fillColor: Color(0xfff3f3f4),
                focusedBorder: OutlineInputBorder(
                  borderSide: BorderSide(color: Colors.blue, width: 5.0),
                ),
                filled: true),
          )
        ],
      ),
    );
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }
}

---

提供一个

TextEditingController

作为参数来构造

CustomTextField

使用函数作为

CustomTextField

的参数，并将其添加到

TextField

的

更改后的
参数中

class CustomTextField {
  static TextField display(BuildContext context, Function onChanged,
      [String name, double size = 16, IconData icon]) {
    return new TextField(
      textAlign: TextAlign.center,
      onChanged: onChanged,
      style: CustomTextStyle.display(context, Colors.black38, size),
      decoration: new InputDecoration(
        alignLabelWithHint: true,
        icon: new Icon(icon),
        contentPadding: EdgeInsets.only(
          top: 30,
          right: 30,
        ),
        border: InputBorder.none,
        hintText: "$name",
        focusedBorder: InputBorder.none,
        hintStyle: CustomTextStyle.display(context, Colors.grey, size),
      ),
    );
  }
}

然后得到你的价值

CustomTextField.display(
  context,
  (value) {
    print(value);
  },
  name,
  16,
  icon,
),

首先，我建议您使用无状态小部件来创建
TextField
，而不是使用如下代码所示的静态函数：

class CustomTextField extends StatelessWidget {
  final Function(String) onChanged;
  final String name;
  final double size;
  final IconData icon;

  CustomTextField({
    this.onChanged,
    this.name,
    this.size: 16,
    this.icon,
  });

  Widget build(BuildContext context) {
    return new TextField(
      textAlign: TextAlign.center,
      onChanged: onChanged,
      style: CustomTextStyle.display(context, Colors.black38, size),
      decoration: new InputDecoration(
        alignLabelWithHint: true,
        icon: new Icon(icon),
        contentPadding: EdgeInsets.only(
          top: 30,
          right: 30,
        ),
        border: InputBorder.none,
        hintText: "$name",
        focusedBorder: InputBorder.none,
        hintStyle: CustomTextStyle.display(context, Colors.grey, size),
      ),
    );
  }
}

然后，为
onChange
字段创建一个函数以接收新值：

class App extends StatelessWidget {
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: width,
        height: height,
        decoration: new BoxDecoration(
          borderRadius: new BorderRadius.all(Radius.circular(20)),
          gradient: new LinearGradient(
            colors: [
              Color.fromRGBO(252, 191, 93, 1),
              Color.fromRGBO(255, 210, 119, 1),
              Color.fromRGBO(252, 215, 85, 1),
            ],
            begin: Alignment.bottomCenter,
            end: Alignment.topCenter,
          ),
        ),
        child: CustomTextField(
          // Here you get the value change
          onChanged: (value) {
            print('Text value changed');
            print('New value: $value');
          },
          name: name,
          size: 16,
          icon: icon,
        ),
      ),
    );
  }
}

请提供onChange函数的主体，以便我可以轻松理解它已经在那里了，这是我没有命名的第二个参数，请查找更新的代码，我在那里提供了一个注释，以使其更清晰。非常欢迎您，如果可行，请勾选它作为答案，以帮助访问者
class App extends StatelessWidget {
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: width,
        height: height,
        decoration: new BoxDecoration(
          borderRadius: new BorderRadius.all(Radius.circular(20)),
          gradient: new LinearGradient(
            colors: [
              Color.fromRGBO(252, 191, 93, 1),
              Color.fromRGBO(255, 210, 119, 1),
              Color.fromRGBO(252, 215, 85, 1),
            ],
            begin: Alignment.bottomCenter,
            end: Alignment.topCenter,
          ),
        ),
        child: CustomTextField(
          // Here you get the value change
          onChanged: (value) {
            print('Text value changed');
            print('New value: $value');
          },
          name: name,
          size: 16,
          icon: icon,
        ),
      ),
    );
  }
}