Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter: Background image is squeezing when keyboard appears

Background image squeeze when the keyboard appears .

Scaffold(
        body: Stack(
          children: <Widget>[

            Container(
              width:double.infinity ,
              height: double.infinity ,
              child: Image.asset('assets/images/bg.png')),
            Container(
                child: SingleChildScrollView(
                  padding: EdgeInsets.all(width*0.10),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.stretch,
                    children: <Widget>[
                      SizedBox(height: height*0.10,),
                      Container(decoration: BoxDecoration(color:Colors.transparent),child: Container(margin: EdgeInsets.only(bottom: height*0.02,left: 20.0,right: 20.0),child: Image.asset('assets/images/logo.png'),),),
                      SizedBox(height: height*0.05,),
                      Container(
                          decoration: BoxDecoration(color: Colors.transparent),
                          child: new Form(
                              key: _formKey,
                              autovalidate: _autoValidate,
                              child: LoginFrom(width,height))),

                    ],
                  ),
                ),
              ),


          ],
        )

    )

enter image description here

like image 577
Farhana Naaz Ansari Avatar asked Feb 11 '19 11:02

Farhana Naaz Ansari


People also ask

How do I stop my keyboard from overflowing my flutter?

The solution to resolve this overflow error is to make your entire widget or in our case the Column scrollable. We can do that by wrapping our Column inside a SingleChildScrollView. Also, wrap the SingleChildScrollView with Center so that the entire UI is centered.

How do you hide the soft keyboard in flutter?

When you click on the TextField it opens up the on-screen keyboard. To hide/dismiss the keyboard you have to press the back button in Android and the done button (inside the onscreen keyboard) in iOS.


1 Answers

Or you should use a Scaffold parameter

resizeToAvoidBottomInset: false

Scaffold(
   resizeToAvoidBottomInset: false,
   body: (your_code)
)
like image 90
gbixahue Avatar answered Sep 28 '22 11:09

gbixahue