How to disable onscreen keyboard on startup of view in Flutter? - 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.

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

Related

Flutter focus textfield without opening softkeyboard?

I'm getting input to my textfield from barcode scanner so I dont need softkeyboard to open when textfield in focus.To achieve that I tried TextInputType.none it hides the keyboard but also can't receive input from scanner.
TextField(
keyboardType: TextInputType.none,
controller: loginTextController,
focusNode: _loginTextfieldFocus,
decoration: decoration(context,loginTextController),
onChanged: (s){
if(s.contains('\n')||s.contains('\r')){
Log.d("Enter event found");
}
},
),
I also tried SystemChannels.textInput.invokeMethod('TextInput.hide'); but it hides only first time. Whenever a character added in textfield softkeyboard becomes visible.

Is there a way for the showTimePicker() in Flutter to not reset any value in TextInputField?

I implemented a page in my Flutter application that has a text input field and 2 time pickers that are activated by pressing the button to make them appear. The issue is that if I have a new value in the TextInputField and use one of the time pickers, after I'm done what I have typed in the input field will just reset.
Code snippet from the input field:
SizedBox(
width: 350,
child: TextField(
controller: titleController,
decoration: const InputDecoration(
border: OutlineInputBorder(),
hintText: 'Title',
),
onChanged: (value) {
title = value;
},
),
),
I've tried keeping the value of what is being typed in through a titleController and I have also attempted using the onChanged() method and a separate variable to keep the value in there. These solutions both didn't work for me, however. Is there any other solution to this issue?
If your TextField inside a stateless widget it will keep clearing the value of the controller everytime something pop on the screen, so try to put your TextField inside a stateful widget

Prevent user from clicking on "." in the numeric keypad after having a decimal point already existing in the textfield in flutter

I have a TextField that i am using to get a double in my flutter app. The TextField uses number keypad.
child: TextField(
style: TextStyle(color: Colors.white),
inputFormatters: [FilteringTextInputFormatter.allow(new RegExp("[0-9.]"))],
controller: controller,
keyboardType: TextInputType.number,
decoration: textDecorator,
onSubmitted: () {
//Some Action
},
),
I have used inputformatter to prevent user from clicking on other punctuations as shown in the code. My issue is i am able to enter something like "23.45.3" which is basically having two "." symbols which should not be allowed. Ideally after "23.", if the user tries to click "." from the keypad again it should be disabled.
Any help on how to do this is appreciated.

How to show Keyboard?

I ask you a question regarding Flutter UI.
I want to show keyboard in ios simulator, but I cannot see.
Could you tell me how to show keyboard in ios simulator?
child: Column(
children: [
TextFormField(
autofocus: true,
textInputAction: TextInputAction.next,
decoration: InputDecoration(
labelText: 'タイトル',
),
validator: (String value) {
if (value.trim().isEmpty) {
return 'タイトル is required';
}
},
),
You should be able to toggle the software keyboard (the one on your simulator) by pressing cmd + k. This is assuming that your TextFormField is working properly. That's something that took me a long time to learn.
You could add keyboard parameter to specify the keyboard type but without it also it should show the keyboard when you click on the textfield
You need to go settings in the Xcode IDE and look the option ¨I/O¨ there is an option call Toggle Software Keyboard

TextFormField ignores any text change after picking image

I've been scratching my head on this. Perhaps someone can help.
I have a statefull widget with a TextFormField and a button that calls the ImagePicker.pickImage function.
When I write something in the textformInput and then click on the select image button, when the image select returns from the picking, the textformfield has the text before I wrote.
It seems the onChanged function is never called when I press the button, so I cannot update my model variable.
I also tried to listen for focus out event on the textformfield widget but it also doesnt get called.
What am I missing? Any tip would be great.
Thanks
TextFormField(
keyboardType: TextInputType.multiline,
maxLines: 5,
controller: _observationsFieldController,
onChanged: (String value) {
onFieldChanged(_observationsFieldController, value);
widget.user_file.observations = value;
},
decoration: InputDecoration(
contentPadding: EdgeInsets.symmetric(horizontal:10, vertical: 2),
hintText: 'Observations',
suffix: clearSuffix(_observationsFieldController),
),
),
Have you tried using setState()? Since you are updating the state, it might work when you call set state.