📜  如何关闭Flutter应用中的虚拟键盘?

📅  最后修改于: 2022-05-13 01:55:00.465000             🧑  作者: Mango

如何关闭Flutter应用中的虚拟键盘?

我们都遇到过填充文本字段后虚拟键盘不会自动消失的情况。我们必须单击智能手机的后退按钮才能移除虚拟键盘。因此,在本文中,我们将看到如何在应用程序中轻轻一按即可关闭虚拟键盘。

为此,我们将使用Flutter UI 手势检测的onTap()属性。

按照以下步骤实现上述功能:

步骤 1:使用手势检测器onTap()属性。

第 2 步:使用unfocus() 方法onTap设置为不聚焦



例子:

看看下面的例子。代码中添加了注释以供参考。

Dart
import 'package:flutter/material.dart';
  
void main() {
  runApp(MyApp());
}
  
// This is the main application widget.
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GFG Unfocous on Tap',
      theme: ThemeData(
        primarySwatch: Colors.green,
      ),
      home: MyHomePage(),
    );
  }
}
  
// This is the homepage
class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}
  
// The GestureDetector wraps the homepage
class _MyHomePageState extends State {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        
      // set onTap to unfocous
      onTap: ()=> FocusScope.of(context).unfocus(),
      child: Scaffold(
          
        // Appbar
        appBar: AppBar(title: Text('KeyBoard dismiss Example'),
        centerTitle: true,
        ),
          
        // homepage design
        body: Padding(
           padding: const EdgeInsets.all(16.0),
            
          // Text input
           child:TextField(
           decoration: InputDecoration(
             border: OutlineInputBorder(),
             labelText: 'Enter the text'
           ),
         ),
        ),
      ),
    );
  }
}


输出: