Estou coletando a entrada do usuário com um TextFormField
e quando o usuário pressiona a FloatingActionButton
indicando que terminou, desejo descartar o teclado na tela.
Como faço o teclado desaparecer automaticamente?
import 'package:flutter/material.dart';
class MyHomePage extends StatefulWidget {
MyHomePageState createState() => new MyHomePageState();
}
class MyHomePageState extends State<MyHomePage> {
TextEditingController _controller = new TextEditingController();
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(),
floatingActionButton: new FloatingActionButton(
child: new Icon(Icons.send),
onPressed: () {
setState(() {
// send message
// dismiss on screen keyboard here
_controller.clear();
});
},
),
body: new Container(
alignment: FractionalOffset.center,
padding: new EdgeInsets.all(20.0),
child: new TextFormField(
controller: _controller,
decoration: new InputDecoration(labelText: 'Example Text'),
),
),
);
}
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new MyHomePage(),
);
}
}
void main() {
runApp(new MyApp());
}
Respostas:
A partir do Flutter v1.7.8 + hotfix.2, o caminho a seguir é:
Comente sobre RP sobre isso:
-> NÃO use
̶r̶e̶q̶u̶e̶s̶t̶F̶o̶c̶u̶s̶(̶F̶o̶c̶u̶s̶N̶o̶d̶e̶(̶)̶
mais.fonte
TextField
outros widgets de edição). Não sei porquê, mas às vezesunfocus
não surte efeito. Substituí-lo pela solução aceita (sem outras alterações) corrige o problema. Talvez esteja relacionado ao local de ondeunfocus
é chamado. Eu preciso chamá-lo, por exemplo, deCheckBoxListTile.onChanged
para dispensar o teclado quando o usuário interage com um widget de caixa de seleção e de outros locais semelhantes. Não me lembro do local exato do problema.Nota: esta resposta está desatualizada. Veja a resposta para versões mais recentes do Flutter .
Você pode dispensar o teclado retirando o foco do
TextFormField
e dando-o a um não utilizadoFocusNode
:fonte
onChanged:
ou na ação de seu botão personalizado?FocusScope.of(context).unfocus()
A solução com FocusScope não funciona para mim. Eu encontrei outro:
Isso resolveu meu problema.
fonte
build
método, por exemplo.Para Flutter 1.17.3 (canal estável em junho de 2020), use
fonte
O exemplo de implementação de .unfocus () para ocultar automaticamente o teclado ao rolar uma lista
você pode encontrar em
https://github.com/flutter/flutter/issues/36869#issuecomment-518118441
Graças a szotp
fonte
Nenhuma das soluções acima não funciona para mim.
Flutter sugere isso - Coloque seu widget dentro do novo GestureDetector () no qual o toque ocultará o teclado e, no toque, use FocusScope.of (contexto) .requestFocus (new FocusNode ())
fonte
O código a seguir me ajudou a esconder o teclado
fonte
tente este gesto de toque
fonte
Como no Flutter tudo é um widget, decidi envolver o
SystemChannels.textInput.invokeMethod('TextInput.hide');
e aFocusScope.of(context).requestFocus(FocusNode());
abordagem em um pequeno módulo de utilitário com um widget e um mixin nele.Com o widget, você pode envolver qualquer widget (muito conveniente ao usar um bom suporte IDE) com o
KeyboardHider
widget:Com o mixin, você pode ativar a ocultação do teclado de qualquer estado ou widget em qualquer interação:
Basta criar um
keyboard_hider.dart
arquivo e o widget e o mixin estarão prontos para uso:fonte
Você pode usar o
unfocus()
método daFocusNode
classe.fonte
unfocus
método. Se você não deseja enviar spam para o seu aplicativo, pode usar uma maneira diferente, como oTextFormField
evento de alteração ou um padrão reativo, que depende da arquitetura do seu aplicativo.Parece abordagens diferentes para versões diferentes. Estou usando o Flutter v1.17.1 e o que está abaixo funciona para mim.
fonte
fonte
tente usar um controlador de edição de texto. no começo,
e no evento na imprensa,
isso descartará o teclado.
fonte
Para resumir, esta é uma solução funcional para o Flutter 1.17:
Envolva seu widget assim:
fonte