개발/Flutter
Flutter TextField 클릭 시 전시된 키보드에 화면이 가려지는 상황 해결 방법
안녕진
2022. 2. 23. 00:05
상황
Column등으로 화면을 구성했을 때, TextField가 있으면 TextField를 누르는 경우 키보드가 올라오며 화면에서 오류 메시지가 나온다.
해결
화면 전체(Scaffold의 Body 부분 등)를 SingleChildScrollView로 감싸면 된다.
만약, Scaffold의 속성 중 resizeToAvoidBottomInset = false를 통해 키보드가 화면에 겹칠 경우 오류 메시지가 뜨지 않도록 한 상태라면,
값을 다시 true로 바꿔주거나 해당 라인을 지워야 한다.
false일 경우 SingleChildScrollView 적용 안됨
코드
@override
Widget build(BuildContext context) {
return Scaffold(
// resizeToAvoidBottomInset: false, // true로 설정 혹은 이 라인을 지워야 된다.
appBar: appBar,
body: SingleChildScrollView( // 이 부분을 추가!
child: Column(
children: [
--- 중략 ---
],
),
),
);
}