Several keyboard issues.
- When the application starts, the keyboard opens only after clicking on the TextFormField. There is no such problem if you go to this form, and set the start page to an empty page.
- When minimizing the application and opening it, the keyboard closes automatically after a second, although the focus on the TextFormField remains.
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:mask_text_input_formatter/mask_text_input_formatter.dart';
class Auth extends StatefulWidget {
const Auth({super.key});
@override
AuthState createState() => AuthState();
}
class AuthState extends State<Auth> {
static FocusNode focusNode = FocusNode();
static TextEditingController controller = TextEditingController();
@override
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) {
//FocusScope.of(context).requestFocus(focusNode);
focusNode.requestFocus();
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
systemOverlayStyle: const SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: Brightness.dark, // For Android (dark icons)
statusBarBrightness: Brightness.light, // For iOS (dark icons)
),
backgroundColor: Colors.transparent,
elevation: 0,
),
body: Padding(
padding: const EdgeInsets.all(50.0),
child: Center(
child: Column(
children: <Widget>[
const SizedBox(height: 100.0),
const Text(
'Добро пожаловать',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8.0),
Container(
//color: Colors.indigo,
constraints: const BoxConstraints(maxWidth: 200),
child: const Text(
'Для входа укажите свой номер телефона',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 16.0, color: Colors.grey),
),
),
const SizedBox(height: 24.0),
TextFormField(
inputFormatters: [
MaskTextInputFormatter(mask: ' # (###) ###-##-##')
],
//focusNode: focusNode,
//controller: controller,
autofocus: true,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
border: OutlineInputBorder(),
labelText: 'Телефон',
),
),
const SizedBox(height: 24.0),
ElevatedButton(
onPressed: () {
focusNode.nextFocus();
},
child: Text('Продолжить', style: TextStyle(fontSize: 16.0)),
),
],
)),
),
);
}
@override
void dispose() {
focusNode.dispose();
controller.dispose();
super.dispose();
}
}
CodePudding user response:
As the auto focus is true in your code, you can call this method in the initState() SystemChannels.textInput.invokeMethod('TextInput.show'); to show the keyboard whenever the app will unminimize the keyboard will appear
CodePudding user response:
You just need to unfocus or change the focus to the new focusnode on the dispose() function.
Also wrap your scaffold with gesturedetector and and the ontap function for unfocus
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:mask_text_input_formatter/mask_text_input_formatter.dart';
class Auth extends StatefulWidget {
const Auth({super.key});
@override
AuthState createState() => AuthState();
}
class AuthState extends State<Auth> {
static FocusNode focusNode = FocusNode();
static TextEditingController controller = TextEditingController();
@override
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) {
//FocusScope.of(context).requestFocus(focusNode);
focusNode.requestFocus();
});
}
@override
void dispose() {
super.dispose();
focusNode.dispose();
controller.dispose();
FocusScope.of(context).requestFocus(new FocusNode());
}
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
FocusScope.of(context).requestFocus(new FocusNode());
},
child: Scaffold(
appBar: AppBar(
systemOverlayStyle: const SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: Brightness.dark, // For Android (dark icons)
statusBarBrightness: Brightness.light, // For iOS (dark icons)
),
backgroundColor: Colors.transparent,
elevation: 0,
),
body: Padding(
padding: const EdgeInsets.all(50.0),
child: Center(
child: Column(
children: <Widget>[
const SizedBox(height: 100.0),
const Text(
'Добро пожаловать',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold),
),
const SizedBox(height: 8.0),
Container(
//color: Colors.indigo,
constraints: const BoxConstraints(maxWidth: 200),
child: const Text(
'Для входа укажите свой номер телефона',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 16.0, color: Colors.grey),
),
),
const SizedBox(height: 24.0),
TextFormField(
inputFormatters: [
MaskTextInputFormatter(mask: ' # (###) ###-##-##')
],
//focusNode: focusNode,
//controller: controller,
autofocus: true,
keyboardType: TextInputType.number,
decoration: const InputDecoration(
border: OutlineInputBorder(),
labelText: 'Телефон',
),
),
const SizedBox(height: 24.0),
ElevatedButton(
onPressed: () {
focusNode.nextFocus();
},
child: Text('Продолжить', style: TextStyle(fontSize: 16.0)),
),
],
)),
),
),
);
}
}