Flutter Dropdown #

I am not sure how much you understand the dropdown but in order to make multi level dropdown you need to understand the dropdown properly.

hintThis value will be shown when no value is selected.
valueThis value will be shown as selected
itemsIt look for list of DropdownMenuItem widget.
onChangedIt is callback and it being called with the value of DropdownButton

You might have notice I have wrote String 5 times. This depends on the value of DropdownButton. It can be anything and every time we are not going to get string. So, it’s important how to work with generic while using DropdownButton.

One more important thing it’s not mandatory to use value and child text as same. Let’s see one more example to understand this.

import 'package:flutter/material.dart';

class DropdownScreenDemo extends StatefulWidget {
  _DropdownScreenDemoState createState() => _DropdownScreenDemoState();

class _DropdownScreenDemoState extends State<DropdownScreenDemo> {
  String selectedCountry;

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Example 1'),
      body: Center(
        child: DropdownButton<String>(
          hint: Text('Country'),
          value: selectedCountry,
          items: <DropdownMenuItem<String>>[
              value: 'USA',
              child: Text('USA'),
              value: 'India',
              child: Text('India'),
          onChanged: (String country) {
            print('You selected "$country"');
            setState(() {
              selectedCountry = country;

I have one article which covers detailed information about flutter dropdown

I have two advance dropdown article too, which cover multilevel dropdown. This could be helpful when you are working with real and complex application. Sometimes one dropdown depends on other dropdown selected data, at that point these two article is going to help you a lot.

comments powered by Disqus