꾸준히 성장하는 개발자

[Flutter] TextField 클릭시 overflow 대응 본문

Flutter

[Flutter] TextField 클릭시 overflow 대응

ahleum 2023. 2. 27. 11:03

TextField를 클릭해서 focus가 되면 키보드가 올라오면서

아래에 위치시켜놓은 pagination이 위로 올라와버리는 현상이 발생

 

구글링 시작

 

아래와 같은 방법을 찾을 수 있었다

 return Scaffold(
      resizeToAvoidBottomInset : false,
  );

 

하지만 위 방법을 쓰다보니 

TextField의 위치에 따라서 키보드 창이 입력창을 덮어버리는 현상이 발생되었다

 

만약 입력창의 위치가 가리지 않는 곳에 있다면 사용하기 괜찮지만

위치가 키보드 창에 가려지는 위치라면 다른 방법을 찾아야 할 것 같다

 

 


 

TextField의 위치가 아래에 있어 키보드 창이 덮어버렸을 때

 

내가 해결한 방법 

사실 이게 정답은 아닐 수 있지만 나중에 필요하면 다시 보려고 정리

 return Scaffold(
      resizeToAvoidBottomInset : true,  // true가 기본값임 안적어도 된다.
      body: SingleChildScrollView(),
  );

 

사실 scroll을 안 주려고 했던 위치였지만 이 부분 해결을 위해서 이렇게 넣어주었다.

이렇게 주면서 위로 올라가지 않았으면 했던 부분도 입력창에 focus가 되면서

같이 올라가 버리는 현상이 발생

 

이 부분 수정을 위해서 다시 한번 고민해봐야 할 것 같다