[Flutter] Keboard 올릴때 Bottom Overflowed By Pixels 에러 처리

개발 환경

---------------------------------

OS : Mac

개발 툴 : android studio

개발 언어 : dart

개발 프레임워크 : flutter

---------------------------------

 

TextField를 클릭하면 키보드가 올라오는데 

키보드 올라오니까 아래 에러가 발생했다.

 

Bottom Overflowed By 52 Pixels

 

1 .인터넷을 좀 뒤적이니 Scaffold 로 위젯을 감싸고 아래 속성값을 주라고 한다.

resizeToAvoidBottomInset: false,

 

 

 

 

 

아래에 파란색 회원가입 버튼이 가려진다.

원하는 모양이 아니다.

 

 

 

 

 

2. SingleChildScrollView 사용

 

class SignUp extends StatelessWidget {
  const SignUp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: SingleChildScrollView(
        child: SignUpPage()
      )
    );
  }
}

 

먼저 Statelesswidget 에서 호출할 화면을 SingleChildScrollView로 감싸줬다.

 

다음 State에서 mainAxisSize에 값을 줬다.

mainAxisSize: MainAxisSize.min,

Widget build(BuildContext context) {
  return Container(
        padding: const EdgeInsets.only(top: 10, left: 20, right: 20, bottom: 10),
        child: Column(
          mainAxisSize: MainAxisSize.min,

 

 

원하는 모양이 나왔다. TextField를 가리지 않는다 !