now people can have more control over how dropdown_formfield looks

1. added UI customization helper classes
2. added input decoration and focus node
3. other cool UI options

although the way of providing label text to DropDownFormField is changed. it provides more flexibility while designing the user interface. the user interface of dropdown can be changed either by providing your own InputDecoration or by providing premade InputDecoration like :

1. RoundedDropDownDecoration
2. OutlinedDropDownDecoration

Nexus 5X API 29 x86 (android-x86 emulator) Flutter 1.9.1 + hotfix.4

Only line changed in code example is: _myActivity = 'Running'; from _myActivity = '';

When putting a breakpoint at onSaved, and then pressing on the save button without selecting anything then value = null. Yet, the dropdown shows the right text.

Problem occured to me when updating a form, inserting initial values, and then clicking on save without changing the initial values. In the mean time, I just check for when it is null, and don't update that field.

import 'package:dropdown_formfield/dropdown_formfield.dart';
import 'package:flutter/material.dart';

void main() => runApp(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> {
  String _myActivity;
  String _myActivityResult;
  final formKey = new GlobalKey<FormState>();

  @override
  void initState() {
    super.initState();
    _myActivity = 'Running';
    _myActivityResult = '';
  }

  _saveForm() {
    var form = formKey.currentState;
    if (form.validate()) {
      form.save();
      setState(() {
        _myActivityResult = _myActivity;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dropdown Formfield Example'),
      ),
      body: Center(
        child: Form(
          key: formKey,
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              Container(
                padding: EdgeInsets.all(16),
                child: DropDownFormField(
                  titleText: 'My workout',
                  hintText: 'Please choose one',
                  value: _myActivity,
                  onSaved: (value) {
                    setState(() {
                      _myActivity = value;
                    });
                  },
                  onChanged: (value) {
                    setState(() {
                      _myActivity = value;
                    });
                  },
                  dataSource: [
                    {
                      "display": "Running",
                      "value": "Running",
                    },
                    {
                      "display": "Climbing",
                      "value": "Climbing",
                    },
                    {
                      "display": "Walking",
                      "value": "Walking",
                    },
                    {
                      "display": "Swimming",
                      "value": "Swimming",
                    },
                    {
                      "display": "Soccer Practice",
                      "value": "Soccer Practice",
                    },
                    {
                      "display": "Baseball Practice",
                      "value": "Baseball Practice",
                    },
                    {
                      "display": "Football Practice",
                      "value": "Football Practice",
                    },
                  ],
                  textField: 'display',
                  valueField: 'value',
                ),
              ),
              Container(
                padding: EdgeInsets.all(8),
                child: RaisedButton(
                  child: Text('Save'),
                  onPressed: _saveForm,
                ),
              ),
              Container(
                padding: EdgeInsets.all(16),
                child: Text(_myActivityResult),
              )
            ],
          ),
        ),
      ),
    );
  }
}

I am trying to use your beautiful package but get this error "The library 'package:dropdown_formfield/dropdown_formfield.dart' is legacy, and shouldn't be imported into a null safe library. (Documentation)" Could you please advice?

#20 Migrate to Null Safety By testing all features and also replace deprecated attribute autovalidate to autovalidateMode and set the default value to disable.

To Migrate to null safety used the dart migrate tool and review code changes. dart migrate

`library dropdown_formfield;

import 'package:flutter/material.dart';

class DropDownFormField extends FormField { final String titleText; final String hintText; final bool required; final String errorText; final dynamic value; final List dataSource; final String textField; final String valueField; final Function onChanged; final bool filled; final EdgeInsets contentPadding;

DropDownFormField( {FormFieldSetter onSaved, FormFieldValidator validator, bool autovalidate = false, this.titleText = 'Title', this.hintText = 'Select one option', this.required = false, this.errorText = 'Please select one option', this.value, this.dataSource, this.textField, this.valueField, this.onChanged, this.filled = true, this.contentPadding = const EdgeInsets.fromLTRB(12, 12, 8, 0)}) : super( onSaved: onSaved, validator: validator, autovalidate: autovalidate, initialValue: value == '' ? null : value, builder: (FormFieldState state) { return Container( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ InputDecorator(

                decoration: InputDecoration(
                  contentPadding: contentPadding,
                  labelText: titleText,
                  filled: filled,
                ),
                child: DropdownButtonHideUnderline(
                  child: DropdownButton<dynamic>(
                    isExpanded: true,
                    hint: Text(
                      hintText,
                      style: TextStyle(color: Colors.grey.shade500),
                    ),
                    value: value == '' ? null : value,
                    onChanged: (dynamic newValue) {
                      state.didChange(newValue);
                      onChanged(newValue);
                    },
                    items: dataSource.map((item) {
                      return DropdownMenuItem<dynamic>(
                        value: item[valueField],
                        child: Text(item[textField],
                            overflow: TextOverflow.ellipsis),
                      );
                    }).toList(),
                  ),
                ),
              ),
              SizedBox(height: state.hasError ? 5.0 : 0.0),
              Text(
                state.hasError ? state.errorText : '',
                style: TextStyle(
                    color: Colors.redAccent.shade700,
                    fontSize: state.hasError ? 12.0 : 0.0),
              ),
            ],
          ),
        );
      },
    );

} `