title: Flutter combo box
body: <p>I am trying to create a dropdown / combobox widget and having a hard time to figure. Below is the code that I have tried. Basically creating a list that I gathered from here and there but not able to put it in my own code accordingly.</p>
  
  <pre><code>import 'package:flutter/material.dart';
  
  class Signup extends StatefulWidget{
  
    Signup({Key key}) : super (key:key);
    final String title;
  
    @override
    SignupPage createState() =&gt; new SignupPage();
  
  }
  
  class SignupPage extends State&lt;Signup&gt; {
  
  @override
  Widget build(BuildContext context) {
  List _countrycodes = ["+65","+91"];
  List&lt;DropdownMenuItem&lt;String&gt;&gt; _dropDownMenuItems;
  String _selectedCountryCode;
  
  List&lt;String&gt; _colors = &lt;String&gt;['', 'red', 'green', 'blue', 'orange'];
    String _color = '';
  
  
  List&lt;DropdownMenuItem&lt;String&gt;&gt; getDropDownMenuItems() {
      List&lt;DropdownMenuItem&lt;String&gt;&gt; items = new List();
      for (String code in _countrycodes) {
        items.add(new DropdownMenuItem(
            value: code,
            child: new Text(code)
        ));
      }
      return items;
    }
    /**return new Material(
      color: Colors.blueAccent,
      child: new Scaffold(
      body: new Stack(
        children: &lt;Widget&gt;[
          new Container(
            decoration: new BoxDecoration(
              image: new DecorationImage(image: new AssetImage("assets/images/download.jpg"), fit: BoxFit.cover,),
            ),
          ),
          new Center(
            child: new Text("Hello LandingPage"),
          )
        ],
      )
    ));**/
  final name = TextFormField(
  keyboardType: TextInputType.text,
  autofocus: false,
  initialValue: 'Techie Quickie',
  decoration: InputDecoration(
    hintText: 'Name',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
  
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  );
  
  final email = TextFormField(
  keyboardType: TextInputType.emailAddress,
  autofocus: false,
  initialValue: 'tq@gmail.com',
  decoration: InputDecoration(
    hintText: 'Email',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
  
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final password = TextFormField(
  keyboardType: TextInputType.text,
  obscureText: true,
  autofocus: false,
  initialValue: 'password',
  decoration: InputDecoration(
    hintText: 'Password',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final passwordConfirmation = TextFormField(
  keyboardType: TextInputType.text,
  obscureText: true,
  autofocus: false,
  initialValue: 'password',
  decoration: InputDecoration(
    hintText: 'Password',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final loginButton = Padding(
    padding: EdgeInsets.symmetric(vertical: 16.0),
    child: Material(
      borderRadius: BorderRadius.circular(30.0),
      shadowColor: Colors.lightBlueAccent.shade100,
      elevation: 5.0,
      child: MaterialButton(
        minWidth: 200.0,
        height: 42.0,
        onPressed: (){
          print("Signup button clicked");
        },
        color: Colors.lightBlueAccent,
        child: 
          Text('Sign Up', 
          style: TextStyle(color: Colors.white, fontSize: 20.0),
          ),
      ),
    )
  );
  
  final countryCode = DropdownButton(
    value: _selectedCountryCode,
    items: _dropDownMenuItems,
    onChanged: null
    );
  
    final inputDecoratoring =InputDecorator(
                      decoration: const InputDecoration(
                        icon: const Icon(Icons.color_lens),
                        labelText: 'Color',
                      ),
                      isEmpty: _color == '',
                      child: new DropdownButtonHideUnderline(
                        child: new DropdownButton&lt;String&gt;(
                          value: _color,
                          isDense: true,
                          onChanged: (String newValue) {
                            setState(() {
                              _color = newValue;
                            });
                          },
                          items: _colors.map((String value) {
                            return new DropdownMenuItem&lt;String&gt;(
                              value: value,
                              child: new Text(value),
                            );
                          }).toList(),
                        ),
                      ),
                    );
  
  
  
  
  
  return Scaffold(
    backgroundColor: Colors.white,
    body: Center  (
      child: ListView(
        padding: EdgeInsets.only(left: 24.0, right: 24.0), 
        shrinkWrap: true,
        children: &lt;Widget&gt;[
  
          name,
          SizedBox(height: 18.0),
          email,
          SizedBox(height: 18.0),
          password,
          SizedBox(height: 18.0),
          passwordConfirmation,
          SizedBox(height: 18.0),
         // countryCode,
         // SizedBox(height: 18.0),
          loginButton,
          SizedBox(height: 38.0),
        ],
        )
        )
  
  );
  
  }
  
  }
  </code></pre>
  
  <p>This is my main.dart class</p>
  
  <pre><code>import 'package:flutter/material.dart';
  
  import 'package:elegal_dart/screens/landing_page.dart';
  import 'package:elegal_dart/screens/home.dart';
  import 'package:elegal_dart/screens/devices.dart';
  import 'package:elegal_dart/screens/signup.dart';
  import 'package:elegal_dart/screens/signin.dart';
  
  /*
  void main()
  {
    Devices( new MaterialApp(
      home: new Devices(),
  
    ));
  
  }*/
  
  void main() =&gt; runApp(new MyApp());
  
  class MyApp extends StatelessWidget
  {
    @override
    Widget build(BuildContext context) 
    {
      return new MaterialApp(
        title: 'Navigation',
        routes: &lt;String, WidgetBuilder&gt;
        {
          '/Home' : (BuildContext context) =&gt; new Home(),
          '/LandingPage' : (BuildContext context) =&gt; new LandingPage(),
          '/Devices' : (BuildContext context) =&gt; new Devices(),
           '/Signup' : (BuildContext context) =&gt; new Signup(),
            '/Signin' : (BuildContext context) =&gt; new Signin(),
  
        },
        //home: new Signin(onSubmit: null),
        home: new Signup(),
        );
    }
  }
  </code></pre>
  
  <p><strong>UPDATED CODE:</strong></p>
  
  <pre><code>import 'package:flutter/material.dart';
  
  
  
  class Signup extends StatefulWidget{
  
    Signup({Key key}) : super (key:key);
    final String title;
  
    @override
    SignupPage createState() =&gt; new SignupPage();
  
  }
  
  class SignupPage extends State&lt;Signup&gt; {
  
  @override
  Widget build(BuildContext context) {
  List _countrycodes = ["+65","+91"];
  List&lt;DropdownMenuItem&lt;String&gt;&gt; _dropDownMenuItems;
  String _selectedCountryCode;
  
  List&lt;String&gt; _ccodes = &lt;String&gt;['', '+65', '+91', '+60', 'orange'];
    String _ccode = '';
  
  
  List&lt;DropdownMenuItem&lt;String&gt;&gt; getDropDownMenuItems() {
      List&lt;DropdownMenuItem&lt;String&gt;&gt; items = new List();
      for (String code in _countrycodes) {
        items.add(new DropdownMenuItem(
            value: code,
            child: new Text(code)
        ));
      }
      return items;
    }
  
  final name = TextFormField(
  keyboardType: TextInputType.text,
  autofocus: false,
  initialValue: 'Techie Quickie',
  decoration: InputDecoration(
    hintText: 'Name',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
  
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  );
  
  final email = TextFormField(
  keyboardType: TextInputType.emailAddress,
  autofocus: false,
  initialValue: 'tq@gmail.com',
  decoration: InputDecoration(
    hintText: 'Email',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
  
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final password = TextFormField(
  keyboardType: TextInputType.text,
  obscureText: true,
  autofocus: false,
  initialValue: 'password',
  decoration: InputDecoration(
    hintText: 'Password',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final passwordConfirmation = TextFormField(
  keyboardType: TextInputType.text,
  obscureText: true,
  autofocus: false,
  initialValue: 'password',
  decoration: InputDecoration(
    hintText: 'Password',
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
    border: OutlineInputBorder(
  
      borderRadius: BorderRadius.circular(32.0)
    ),
  
  ),
  
  );
  
  final loginButton = Padding(
    padding: EdgeInsets.symmetric(vertical: 16.0),
    child: Material(
      borderRadius: BorderRadius.circular(30.0),
      shadowColor: Colors.lightBlueAccent.shade100,
      elevation: 5.0,
      child: MaterialButton(
        minWidth: 200.0,
        height: 42.0,
        onPressed: (){
          print("Signup button clicked");
        },
        color: Colors.lightBlueAccent,
        child: 
          Text('Sign Up', 
          style: TextStyle(color: Colors.white, fontSize: 20.0),
          ),
      ),
    )
  );
  
  final countryCode = DropdownButtonHideUnderline (
    child:  DropdownButton&lt;String&gt;(
            value: _ccode,
            isDense: true,
            items: _ccodes.map((String value) {
                            return new DropdownMenuItem&lt;String&gt;(
                              value: value,
                              child: new Text(value),
                            );
                          }).toList(),
                    onChanged: (String newValue) {
                            setState(() {
                              _ccode = newValue;
                            });
                          }
    )
    );
  
  
  
  
  
  
  
  return Scaffold(
    backgroundColor: Colors.white,
    body: Center  (
      child: ListView(
        padding: EdgeInsets.only(left: 24.0, right: 24.0), 
        shrinkWrap: true,
        children: &lt;Widget&gt;[
  
          name,
          SizedBox(height: 18.0),
          email,
          SizedBox(height: 18.0),
          password,
          SizedBox(height: 18.0),
          passwordConfirmation,
          SizedBox(height: 18.0),
          countryCode,
          SizedBox(height: 18.0),
          loginButton,
          SizedBox(height: 38.0),
        ],
        )
        )
  
  
  );
  
  
  
  
  }
  
  }
  </code></pre>
  
  <p>The error that I am getting in the AVD</p>
  
  <p><a href="https://i.stack.imgur.com/9YAHg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9YAHg.png" alt="enter image description here"></a></p>