Search code examples
flutterkeyboardtextformfield

How to disable onscreen keyboard on startup of view in Flutter?

I started out writing a Flutter app to remotely control some radio stream. I ran into a problem when adding a TextFormField to display the stream's current volume setting. (The reason why I opted for a TextFormField instead of simply Text is that I wanted to use the field for both showing the current setting and letting the user change the current value in one place.)

The problem is the following: When I added the TextFormField (located inside the green bar in the screen shot below, after the text Vol:), I realized that whenever I started this view/page, the onboard keyboard always showed up by default when entering the page.

Instead, I would like the keyboard to only show up when the user clicks inside the TextFormField.

The code for the TextFormField looks as follows:

TextFormField(
  onFieldSubmitted: (value){
    print("The value entered is : $value");
  },
  // Define keyboard type
  keyboardType: TextInputType.number,
  // Make sure user doesn't enter letters or punctuation
  inputFormatters: <TextInputFormatter>[WhitelistingTextInputFormatter.digitsOnly],
  validator: (val){
    return null; 
  },
  autofocus: true,
  controller: volTextEditingController,
  style: TextStyle(
    color: Colors.white,
    fontSize: 16,
  ),
  decoration: InputDecoration(
    border: InputBorder.none,
  ),
  maxLines: 1,
)

So, I was wondering whether someone knows how to prevent the keyboard from appearing on startup of the shown view/page. Thanks in advance! The full code, if needed, is available on GitGub.

enter image description here

Solution

  • I just figured out that this problem was caused by the setting autofocus: true. So, removing this solves the issue.