Flutter
[Flutter] TextField Focus 해제
_annie_
2021. 11. 6. 20:05
728x90
키보드의 완료 버튼을 누르면 기본적으로 키보드가 내려가면서 포커스도 해제되지만,
꼭 완료 버튼을 누르지 않아도 배경을 터치했을 때나 특정 버튼을 눌렀을 때 키보드를 내리고 싶을때가 있다.
텍스트필드의 포커스를 해제시키고 싶을 때 사용할 수 있는 방법!
1. FocusNode 객체를 생성한다.
FocusNode textFocus = FocusNode();
2. TextField 위젯에 생성한 FocusNode를 연결한다.
TextField(
maxLines: 1,
focusNode: widget.textFocus,
)
3. 원하는 이벤트가 발생했을 때 unfocus 해준다.
widget.textFocus.unfocus();
여기서 원하는 이벤트 예시 ---> 텍스트필드가 아닌곳을 선택했을때 혹은 버튼을 눌렀을때
1) 텍스트필드가 아닌 다른곳을 눌렀을 때 포커스를 없애고싶다면
전체 화면에서 이벤트를 받아야되기때문에 MaterialApp를 GestureDetector로 감싸준다.
onTap 이벤트가 발생했을 때 unfocus 해준다.
GestureDetector(
onTap: (){
widget.textFocus.unfocus();
},
child: MaterialApp(
)
...생략
)
2) 특정 버튼을 눌렀을때 포커스를 없애고싶다면
특정버튼의 onPressed 이벤트가 발생할 때 unfocus 해준다.
TextButton(
onPressed: () {
widget.textFocus.unfocus();
}
)
728x90
반응형