Как отключить клавиатуру в TextFormfeild flutter 2.0.1
Эй, как мне закрыть здесь клавиатуру? Я хочу, чтобы клавиатура отключалась при касании за пределами области.
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.fromLTRB(15, 0, 15, 0),
child: TextFormField(
keyboardType: TextInputType.number,
maxLength: 10,
controller: widget._phoneController,
onTap: () => FocusScope.of(context).unfocus(),
inputFormatters: [
//input type
FilteringTextInputFormatter.allow(
RegExp(r'[0-9]'),
),
],
//how the text box is decorated
decoration: buildInputDecoration(
Icons.phone, 'Enter your 10 digit phone number'),
),
);
}
3 ответа
Вы можете обернуть родительский виджет, занимающий весь экран, виджетом, который может обнаруживать клики. В ,
FocusScope.of(context).unfocus()
FocusScope.of(context)
получает текущий сфокусированный узел и
.unfocus()
расфокусирует это.
Это работает, потому что когда
TextFormField
нажимается, он потребляет щелчок. Таким образом, родительский виджет не запускается. Так что расфокусировки не происходит.
Когда мы щелкаем снаружи, родительский виджет потребляет событие щелчка, потому что ни один из его дочерних виджетов не потребляет его. Таким образом, родительский
onClick
срабатывает.
Ниже приведен пример. Вы можете увидеть демонстрацию на DartPad .
(Хотя лучше всего запустить его на мобильном устройстве, чтобы видеть экранную клавиатуру.)
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Hide keyboard in TextFormField when touched outside'),
),
body: GestureDetector(
onTap: () {
print('Clicked outside');
FocusScope.of(context).unfocus();
},
child: Container(
color: Colors.white,
child: Form(
child: Column(
children: [
TextFormField(
onTap: () => print('Clicked TextFormField'),
),
],
),
),
),
),
);
}
}
Работал для меня :)
TextField(
onSubmitted: (value) async {
FocusScope.of(context).unfocus();
},
})
Вы можете найти хорошее обсуждение этого вопроса. Проверьте это 👇