[flutter] 플러터 Flutter_typeahead에서 키보드 이벤트 처리하기

플러터는 크로스 플랫폼 모바일 앱 개발을 위한 프레임워크로서, 다양한 기능을 제공합니다. 그 중 하나인 flutter_typeahead 패키지는 자동 완성 기능을 제공하며, 사용자가 키보드를 사용하여 검색어를 입력할 때 키보드 이벤트를 처리해야 할 때 유용합니다.

이 글에서는 flutter_typeahead에서 키보드 이벤트를 처리하는 방법을 알아보겠습니다.

1. textEditingController 사용하기

flutter_typeahead 패키지는 TextEditingController를 사용하여 텍스트 필드의 값을 제어합니다. 이를 활용하여 키보드 이벤트를 처리할 수 있습니다.

TextEditingController _searchController = TextEditingController();

Widget build(BuildContext context) {
  return TypeAheadField(
    ...
    controller: _searchController,
    ...
  );
}

2. 키보드 이벤트 리스너 등록하기

flutter_typeaheadkeyboardListener라는 콜백 함수를 제공합니다. 이를 활용하여 키보드 이벤트를 감지하고 원하는 로직을 실행할 수 있습니다.

TypeAheadField(
  ...
  keyboardListener: (event) {
    if (event.isKeyPressed(LogicalKeyboardKey.enter)) {
      // 엔터 키가 눌렸을 때 실행할 로직
    }
  },
  ...
)

위의 예제에서는 엔터 키가 눌렸을 때 원하는 로직을 실행하도록 구성하였습니다. event.isKeyPressed 함수를 사용하여 특정 키가 눌렸는지 확인할 수 있습니다.

3. 추가적인 키보드 이벤트 처리

키보드 이벤트 중에서 원하는 이벤트를 처리하려면 keyboardListener에서 해당 이벤트를 감지하는 로직을 구현해야 합니다. 예를 들어, ESC 키를 눌렀을 때 검색어를 초기화하고 결과를 갱신하고자 한다면 다음과 같이 처리할 수 있습니다.

keyboardListener: (event) {
  if (event.isKeyPressed(LogicalKeyboardKey.escape)) {
    _searchController.clear(); // 검색어 초기화
    // 결과 갱신 로직 실행
  }
}

결론

flutter_typeahead에서 키보드 이벤트를 처리하는 방법을 알아보았습니다. textEditingControllerkeyboardListener를 사용하여 키보드 이벤트를 감지하고 원하는 로직을 실행할 수 있습니다. 플러터의 다양한 기능을 활용하여 앱 개발을 더욱 편리하고 유연하게 만들어보세요.

참고 자료