DropdownButtonFormField is not resetting first time

Question

I want to reset DropdownButtonFormField. I mange to reset it by setting it's value null and using globalkey as following code.

Here, problem is that i need to click twice to reset it.

Note: I know using DropdownButton, we can reset more easily but my question is why DropdownButtonFormField is not resetting when i click first time.

After Update:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  MyAppState createState() => MyAppState();
}

class MyAppState extends State<MyApp> {
  String abc;
  FocusNode _node = FocusNode();
  GlobalKey<FormState> _key = GlobalKey<FormState>();
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          body: Form(
            key: _key,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Focus(
                  focusNode: _node,
                  onFocusChange: (bool focus) {
                    setState(() {});
                  },
                  child: Listener(
                    onPointerDown: (_) {
                      FocusScope.of(context).requestFocus(_node);
                    },
                    child: DropdownButtonFormField(
                      hint: Text('select value'),
                      value: abc,
                      items: <String>['A', 'B', 'C', 'D'].map((String value) {
                        return DropdownMenuItem<String>(
                          value: value,
                          child: Text(value),
                        );
                      }).toList(),
                      onChanged: (String newValue) {
                        setState(() {
                          abc = newValue;
                        });
                      },
                    ),
                  ),
                ),
                Text("value is $abc"),
              ],
            ),
          ),
          floatingActionButton: FloatingActionButton(
            onPressed: () {
              setState(() {
                abc = null;
                _key.currentState.reset();
              });
            },
            tooltip: 'Reset',
            child: Icon(Icons.clear),
          )),
    );
  }
}

Answer 1

you may need to make manual Focus you need to give the global key to form as well

FocusNode _node = FocusNode();
...


  Focus(
                focusNode: _node,
                onFocusChange: (bool focus) {
                  setState(() {});
                },
                child: Listener(
                  onPointerDown: (_) {
                    FocusScope.of(context).requestFocus(_node);
                  },
                  child: DropdownButtonFormField(
                    iconSize: 50,
                    onChanged: (s) {
                      setState(() {
                        abc = s;
                      });
                    },
                    hint: Text(
                      'Select Text',
                    ),
                    items: [
                      DropdownMenuItem(value: '1', child: Text('A')),
                      DropdownMenuItem(value: '2', child: Text('B')),
                      DropdownMenuItem(value: '3', child: Text('C')),
                      DropdownMenuItem(value: '4', child: Text('D')),
                    ],
                  ),
                ),
              ),

...
 FloatingActionButton(
          onPressed: () {
            setState(() {
              print("hello");
              abc = null;
              _key.currentState.reset();
            });
            // _flyIronMan();
          },
          child: Icon(Icons.add),
        ),