5 способов скрыть клавиатуру во Flutter – подробное руководство

Во Flutter управление клавиатурой является важной частью обеспечения удобства работы пользователя. Существуют различные сценарии, в которых вы можете захотеть скрыть клавиатуру программно. В этой статье мы рассмотрим пять различных методов достижения этой цели во Flutter, а также примеры кода. Давайте начнем!

Метод 1: использование класса FocusScope

import 'package:flutter/material.dart';
// Create a FocusNode instance
FocusNode _focusNode = FocusNode();
// Attach the FocusNode to the TextField
TextField(
  focusNode: _focusNode,
);
// Hide the keyboard
FocusScope.of(context).requestFocus(FocusNode());

Метод 2: использование класса SystemChannels

import 'package:flutter/services.dart';
// Hide the keyboard
SystemChannels.textInput.invokeMethod('TextInput.hide');

Метод 3. Использование виджета TextFormField

import 'package:flutter/material.dart';
// Create a GlobalKey instance
GlobalKey<FormState> _formKey = GlobalKey<FormState>();
// Create a TextEditingController instance
TextEditingController _textEditingController = TextEditingController();
// Wrap your TextFormField with a Form widget
Form(
  key: _formKey,
  child: TextFormField(
    controller: _textEditingController,
  ),
);
// Hide the keyboard
FormState _formState = _formKey.currentState;
_formState.reset();

Метод 4. Использование виджета GestureDetector

import 'package:flutter/material.dart';
// Create a FocusNode instance
FocusNode _focusNode = FocusNode();
// Attach the FocusNode to the TextField
TextField(
  focusNode: _focusNode,
);
// Hide the keyboard
GestureDetector(
  onTap: () {
    _focusNode.unfocus();
  },
  child: Container(
    // Your widget tree
  ),
);

Метод 5: использование пакета KeyboardVisibilityBuilder

import 'package:flutter/material.dart';
import 'package:keyboard_visibility_builder/keyboard_visibility_builder.dart';
// Wrap your widget tree with KeyboardVisibilityBuilder
KeyboardVisibilityBuilder(
  builder: (context, isKeyboardVisible) {
    return Scaffold(
      // Your widget tree
    );
  },
);
// Hide the keyboard
KeyboardVisibilityBuilder(
  builder: (context, isKeyboardVisible) {
    if (isKeyboardVisible) {
      FocusScope.of(context).requestFocus(FocusNode());
    }
    return Scaffold(
      // Your widget tree
    );
  },
);

В этой статье мы рассмотрели пять различных способов скрыть клавиатуру во Flutter. Предпочитаете ли вы использовать встроенные классы Flutter, такие как FocusScopeи TextFormField, или внешние пакеты, такие как KeyboardVisibilityBuilder, теперь у вас есть множество вариантов выбора. от. Выберите метод, который лучше всего соответствует требованиям вашего проекта, и создайте удобный пользовательский интерфейс. Приятного кодирования!