I am currently experiencing an issue where the keyboard does not appear when I select any TextFormField
widgets inside of a Form
widget. This is the code for the form, which is inside of my CreateAccountForm
Stateful widget.
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:sign_up_page/constants.dart';
class CreateAccountForm extends StatefulWidget {
@override
_CreateAccountFormState createState() => _CreateAccountFormState();
}
class _CreateAccountFormState extends State<CreateAccountForm> {
final _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Form(
key: _formKey,
child: Column(
children: <Widget>[
CustomTextFormField(
labelText: "Email",
keyboardType: TextInputType.emailAddress,
),
Spacer(),
CustomTextFormField(labelText: "Full name"),
Spacer(),
CustomTextFormField(
labelText: "Password",
isPassword: true,
),
Spacer(),
RaisedButton(
onPressed: () {
print("Get started button pressed");
},
padding: EdgeInsets.all(20.0),
color: blueMaterialColor.shade100,
shape: defaultRectangularButtonShape,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
"Get started",
style: TextStyle(
fontSize: 20.0,
color: Colors.white,
),
),
Icon(
Icons.arrow_forward,
color: Colors.white,
),
],
),
),
Spacer(),
],
),
);
}
}
class CustomTextFormField extends StatefulWidget {
CustomTextFormField({
@required this.labelText,
this.isPassword = false,
this.keyboardType = TextInputType.text,
});
final String labelText;
final bool isPassword;
final TextInputType keyboardType;
@override
_CustomTextFormFieldState createState() => _CustomTextFormFieldState();
}
class _CustomTextFormFieldState extends State<CustomTextFormField> {
@override
Widget build(BuildContext context) {
return TextFormField(
decoration: InputDecoration(
labelText: widget.labelText, labelStyle: inputLabelStyleUnselected),
style: inputTextStyle,
obscureText: widget.isPassword,
keyboardType: widget.keyboardType,
);
}
}
This is a screenshot, which shows the cursor inside of the email TextFormWidget
, but without the keyboard showing up:
You can view all of the code for the project on my Github branch here: https://github.com/Jordan-Gillard/sign_up_page/tree/bug/fixing_keyboard_not_showing
You can use the autofocus:true property of the TextField: Whether this text field should focus itself if nothing else is already focused. So whenever the widget appears on screen, if theres nothing else with the keyboard focus, the focus will automatically be directed to it, thus opening the keyboard.
If you are running on a Simulator
, your Simulator
definitely has the Connect Hardware Keyboard
enabled. You can fix the issue by disabling the feature.
I provided images to guide on how to do that below:
Hardware
tab.Hardware
tab, select the Keyboard
option.Connect Keyboard Hardware
option to enabling toggling an actual keyboard on the Simulator
Check the Images provided below for more visual description :)
If you use ios simulator, the menu tab is I/O. enter image description here
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With