Question

我是Flutter的新手。这是注册和登录屏幕代码。我不知道如何单击注册按钮来获取用户输入的所有数据并调用api。如果可行，请给我一个解决方案，然后我接受您的回答这里有人为此提供解决方案吗？提前致谢。这是我的代码。

main.dart

 import 'package:flutter/material.dart';

    void main() {
      runApp(MaterialApp(
        title: 'Navigation Basics',
        home: _MyHomePageState(),
      ));
    }
    class _MyHomePageState extends StatelessWidget {
      TextStyle style = TextStyle(fontFamily: 'Montserrat', fontSize: 20.0);
       String fname = '';

      @override
      Widget build(BuildContext context) {
        final firstnameField = TextField(
          onChanged: (fname) {
            print("First text field: $fname");
          },
          obscureText: false,
          style: style,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
            hintText: "First Name",
            hintStyle: TextStyle(color: Colors.black),
          ),
        );
        final lastnameField = TextField(
          obscureText: false,
          style: style,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
            hintText: "Last Name",
            hintStyle: TextStyle(color: Colors.black),
          ),
        );

        final emailField = TextField(
          obscureText: false,
          style: style,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
            hintText: "Email",
            hintStyle: TextStyle(color: Colors.black),
          ),
        );

        final passwordField = TextField(
          obscureText: true,
          style: style,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
            hintText: "Password",
            hintStyle: TextStyle(color: Colors.black),
          ),
        );
        final phonenumberField = TextField(
          keyboardType: TextInputType.number,
          obscureText: false,
          style: style,
          decoration: InputDecoration(
            contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
            hintText: "Number",
            hintStyle: TextStyle(color: Colors.black),
          ),
        );
        final signupButon = Material(
          elevation: 5.0,
          borderRadius: BorderRadius.circular(30.0),
          color: Colors.purple,
          child: MaterialButton(
            minWidth: MediaQuery.of(context).size.width,
            padding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),

            onPressed: () {
            },
            child: Text("Signup",
                textAlign: TextAlign.center,
                style: style.copyWith(
                    color: Colors.white, fontWeight: FontWeight.bold)),
          ),
        );

        return Scaffold(
          body: Center(
            child: Container(
              decoration: new BoxDecoration(
                image: new DecorationImage(
                  image: new AssetImage("background.png"),
                  fit: BoxFit.fill,
                ),
              ),
              child: Padding(
                padding: const EdgeInsets.all(36.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    new Text(
                      'Signup',
                      style: new TextStyle(color: Colors.black, fontSize: 30.0),
                    ),
                    SizedBox(height: 20.0),
                    firstnameField,
                    SizedBox(height: 20.0),
                    lastnameField,
                    SizedBox(height: 20.0),
                    phonenumberField,
                    SizedBox(height: 20.0),
                    emailField,
                    SizedBox(height: 25.0),
                    passwordField,
                    SizedBox(height: 35.0),
                    signupButon,
                    SizedBox(height: 15.0),
                  ],
                ),
              ),
            ),
          ),
        );
      }
    }

Answer 1

对每个文本字段使用TextEditingController usernameController = TextEditingController();，对每个文本字段都使用controller: usernameController

现在您可以随时使用usernameController.text获取每个文本字段的文本

Answer 2

这是一个简单的登录表单

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  TextEditingController _usernameController = TextEditingController();
  TextEditingController _passwordController = TextEditingController();

  @override
  void dispose() {
    _usernameController.dispose();
    _passwordController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('demo'),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Form(
            key: _formKey,
            autovalidate: true,
            onWillPop: () async {
              return false;
            },
            onChanged: () {},
            child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                TextFormField(
                  autofocus: true,
                  controller: _usernameController,
                  decoration: InputDecoration(
                    labelText: "username",
                    icon: Icon(
                      Icons.person,
                      color: Theme.of(context).primaryColor,
                    ),
                  ),
                  validator: (String v) {
                    return v.trim().isNotEmpty ? null : "Can not be empty";
                  },
                ),
                TextFormField(
                  controller: _passwordController,
                  decoration: InputDecoration(
                    labelText: "password",
                    icon: Icon(
                      Icons.lock,
                      color: Theme.of(context).primaryColor,
                    ),
                  ),
                  obscureText: true,
                  validator: (String v) {
                    return v.trim().isNotEmpty ? null : "Can not be empty";
                  },
                ),
                RaisedButton(
                  onPressed: () {
                    if (_formKey.currentState.validate()) {
                      print('login');
                      print(_usernameController.text);
                      print(_passwordController.text);
                    }
                  },
                  child: Text('login'),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

如何在抖动中设置状态数据？

2 个答案: