Flutter-使用更新的信息更新DropdownButtonFormField项目

时间:2020-02-16 22:51:54

标签: flutter

我正在一个小组项目中,在该项目中我们从RESTful API异步获取信息,并在最终收到该信息时需要用API的信息填充DropdownButtonFormField。我一直无法找到任何更新字段的方法,而且由于我只是编写了将应用程序连接到我们的API的dart函数,所以我不太了解flutter代码。这是我的团队成员之一编写的代码:

class _CreateProfilePageState extends State<CreateProfilePage> {
  TextStyle style = TextStyle(fontFamily: 'Roboto', fontSize: 20.0);
  final _createProfileKey = GlobalKey<FormState>(); //Key for all
  final Map<String, dynamic> createProfileForm = {'fName': null, 'lName': null, 'gender': null};

  /*
  TODO: set List<String> _genders to be the list from the API. Don't touch _genderChoice.
    - More verbosely, get the string representation of each gender from the api and put it them in a list
   */

  List<String> _genders = new List<String>(); // = ['Male', 'Female', 'Non-Binary']; // Replace this with genders from API
  String _genderChoice;

  @override
  Widget build(BuildContext context) {
    //Input field for email
    final firstNameInput = TextFormField(
      obscureText: false,
      style: style,
      decoration: InputDecoration(
        hintText: "First Name",
      ),
      validator: (value){
        if (value.isEmpty){
          return 'Field Required';
        }
        return null;
      },
      onSaved: (String value){
        createProfileForm['fName'] = value;
      },
    );


    //Input field for password
    final lastNameInput = TextFormField(
      obscureText: false,
      style: style,
      decoration: InputDecoration(
        hintText: "Last Name",
      ),
      validator: (value) {
        if (value.isEmpty) {
          return 'Field Required';
        }
        return null; //passed all tests, return null
      },
      onSaved: (String value) {
        createProfileForm['lName'] = value;
      },
    );


    final genderSelect = DropdownButtonFormField(
      style: style.copyWith(color: Colors.black),

      items: _genders.map((String gender) {
        return new DropdownMenuItem(
          value: gender,
          child: new Text(gender),
        );
      }).toList(),
      decoration: InputDecoration(
        contentPadding: new EdgeInsets.symmetric(vertical: 7.5, horizontal: 10.0),
        hintText: 'Gender',
      ),
      onChanged: (selected) {
        createProfileForm['gender'] = selected;
        setState(() {
          _genderChoice = selected;
        });
      },
      value: _genderChoice,
    );

    //final birthdaySelect =
    //final genderPreferences (maybe make this its own checkbox page)
    //final ageRange (need age min and age max)


    //Function to check credentials entered
    void checkCredentials(){
      if(_createProfileKey.currentState.validate()) {
        //If valid, save info in form
        _createProfileKey.currentState.save();

        /*
        TODO: HI, HERE'S WHERE YOUR EDITING STARTS AND ENDS
          - Now we have an account
          - Add all the info in our createProfileForm map to the account
          - once again return true if it works and false if any errors and throw that into a variable for me to use
        */
        print(createProfileForm);
        Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => CreateMediaPref())
        );
      }
    }

    //This is the Login button
    final submitButton = Material(
      elevation: 2.0,
      borderRadius: BorderRadius.circular(32.0),
      color: Colors.cyan[700],
      child: MaterialButton(
        onPressed: (){
          checkCredentials();
          //maybe show error here?
        },
        child: Text("Submit",
            textAlign: TextAlign.center,
            style: style.copyWith(color: Colors.white)
        ),
      ),
    );


    return Scaffold(
      appBar: AppBar(
        title: Text('Create Profile', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
      ),
      body: Center(
        //Background
        child: Container(
          color: Colors.white,
          //Outer borders
          child: Padding(
            padding: const EdgeInsets.all(36.0),
            //This is the COLUMN of all the items we want to stack
            child: Form(
              key: _createProfileKey,
              child: ListView(
                children: <Widget>[
                  SizedBox(height: 35.0), //distance at top
                  SizedBox(height: 15.0), firstNameInput,
                  SizedBox(height: 15.0), lastNameInput,
                  SizedBox(height: 15.0), genderSelect,
                  SizedBox(height: 30.0), submitButton,
                  SizedBox(height: 15.0), //distance at bottom

                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

我们API中的性别列表将保留在_genders中,但是我不确定要在回调函数中添加什么内容,以便使用新填充的_genders List重新加载sexSelectDropdownButtonFormField。

0 个答案:

没有答案