how to add a textfield value based on dropdown list in flutter

I am still new to Flutter.In here i want to select the value from a drop down list to the category form field.But i get a error when trying to define

child: DropdownButtonHideUnderline

inside Textformfield.I try to find a solution, but I can't find it and I am not able to program it by myself. I hope you can help me.Is there any other way to archive this?

my codes are here, Thanks in advance for your guidance.

class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

 final AuthService _auth = AuthService();
 final _formKey = GlobalKey<FormState>();
 String error = '';
 bool loading = false;
 String name = '';
 String nickname = '';
 String city = '';


 @override
 Widget build(BuildContext context) {
   return Container(
    child: Scaffold(
    backgroundColor: Colors.brown[50],
    appBar: AppBar(
      title: Text('Brew Crew'),
      backgroundColor: Colors.brown[400],
      elevation: 0.0,
      actions: <Widget>[
        FlatButton.icon(
          icon: Icon(Icons.person),
          label: Text('logout'),
          onPressed: () async {
            await _auth.signOut();
          },
        ),
      ],
    ),
    body: Container(
      padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 50.0),
      child: Form(
        key: _formKey,
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              SizedBox(height: 20.0),
              TextFormField(
                decoration: textInputDecoration.copyWith(hintText: 'Name'),
                validator: (val) => val.isEmpty ? 'Enter your name' : null,
                onChanged: (val) {
                  setState(() => name = val);
                },
              ),
              SizedBox(height: 20.0),
              TextFormField(
                decoration: textInputDecoration.copyWith(hintText: 'NickName'),
            onChanged: (val) {
              setState(() => nickname = val);
            },
              ),
              SizedBox(height: 20.0),
              TextFormField(
                decoration: textInputDecoration.copyWith(hintText: 'City'),
                validator: (val) => val.isEmpty ? 'Enter your city' : null,
                onChanged: (val) {
                  setState(() => city = val);
                },
              ),
              SizedBox(height: 20.0),
              TextFormField(
                decoration: textInputDecoration.copyWith(hintText: 'Category'),
                validator: (val) => val.isEmpty ? 'Please select a category' : null,
                onChanged: (val) {
                  setState(() => nickname = val);
                },
              ),
              SizedBox(height: 20.0),
              RaisedButton(
                  color: Colors.pink[400],
                  child: Text(
                    'Submit',
                    style: TextStyle(color: Colors.white),
                  ),
                  onPressed: () async {

                  }
              ),
              SizedBox(height: 12.0),
              Text(
                error,
                style: TextStyle(color: Colors.red, fontSize: 14.0),
              )
            ],
          ),
        ),
      ),
    ),
  ),
);
}
}

Solution

The problem here is that you do not need a TextFormField, you would require a DropdownButton Widget.

                  DropdownButton(
                    items: <DropdownMenuItem>[
                      DropdownMenuItem(
                        child: Text("Category I"),
                      ),
                      DropdownMenuItem(
                        child: Text("Category II"),
                      ),
                    ],
                    onChanged: (value) {

                    },
                  ),

I created you a codepen for that: https://codepen.io/md-weber/pen/zYvqaGv