在键盘打开之前在 TextField 中点击打开对话框 - Flutter

Question

Tapping in a TextField gives it focus and causes the keyboard to pop up. I need to show a dialog with a choice to the user before she/he types into the TextField.

I can do it but it's ugly: first the TextField gets focus and the keyboard comes up, then the dialog pops up and the keyboard disappears (since the TextField looses focus). Then the focus goes back to the tapped TextField and the keyboard comes back up.

I'd like to avoid all the ups and downs and I cannot add any extra buttons to call the dialog from somwhere else other then tapping on the TextField.

Is there a way to do it so that the dialog appears first (without the keyboard showing up) and after the choice the focus goes to the tapped TextField?

Answer 1

You can follow a simple trick. There is a read-only properties of TextField, you can use a flag on that read-only properties. When user chooses a selection from pop up, than change focus to that TextField.

bool readOnly = true;
FocusNode f1 = FocusNode();

TextFormField(                                
     read-only: readOnly ,
     focusNode: f1,
     decoration: InputDecoration(
     border: OutlineInputBorder(
     borderRadius: BorderRadius.circular(4.0)
      ),
      ),
     style: TextStyle(
      color: Colors.orange,
      fontSize: 15.0,
      ),
      ),

on your dialog code when selecting:

readOnly = false;
FocusScope.of(context).requestFocus(f1);

Answer 2

store a map of focusNodes in a scoped model/context provider

check map if it should open dialog on specific focus node.