Проблема перекрытия флаттера не решена с помощью resizeToAvoidBottomPadding - PullRequest
0 голосов
/ 12 апреля 2019

По сути, у меня есть страница входа, где я делю первый сегмент на 2 контейнера, один из которых занимает 55% и 45% экрана.Затем поверх этих двух контейнеров я добавляю еще один контейнер с верхними 40% размера экрана, и в нем у меня есть еще один контейнер, в котором хранятся мое имя пользователя и текстовое поле пароля.Так что по дизайну я в порядке.

Теперь проблема, когда клавиатура приходит в поле пароля, полностью не видна.Сначала у меня был только стек, затем я сделал Google, и некоторые предлагают поставить Scaffold и добавить эту строку resizeToAvoidBottomPadding: false, но, похоже, у меня тоже не работает.

Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomPadding: false,
      body: Container(
        child: Stack(

      children: <Widget>[

        // The containers in the background
        new Column(
          children: <Widget>[
            new Container(
              height: MediaQuery.of(context).size.height * .55,
             //color: Colors.blue,
              decoration: new BoxDecoration(
               image: new DecorationImage(image: new AssetImage("lib/assets/cbg.png"), fit: BoxFit.cover,),
             ),
            ),
            new Container(
              height: MediaQuery.of(context).size.height * .45,
              color: Colors.white,
            )
          ],
        ),
        // The card widget with top padding, 
        // incase if you wanted bottom padding to work, 
        // set the `alignment` of container to Alignment.bottomCenter
        new Container(
          alignment: Alignment.topCenter,
          padding: new EdgeInsets.only(
              top: MediaQuery.of(context).size.height * .40,
              right: 20.0,
              left: 20.0),
          child: new Container(

            height: MediaQuery.of(context).size.height * .45,
            width: MediaQuery.of(context).size.width,
            child: new Card(
              color: Colors.white,
              elevation: 4.0,
              child: Padding(
              padding: EdgeInsets.symmetric(horizontal: 40.0),

              child: Column(
                children: <Widget>[
                SizedBox(height: MediaQuery.of(context).size.height * .05),
new TextFormField(
                      decoration: new InputDecoration(
                        labelText: "Enter Email",
                        fillColor: Colors.white,
                        border: new OutlineInputBorder(
                          borderRadius: new BorderRadius.circular(10.0),
                          borderSide: new BorderSide(
                            color: Colors.blue
                          ),
                        ),
                        //fillColor: Colors.green
                      ),
                      validator: (val) {
                        if(val.length==0) {
                          return "Email cannot be empty";
                        }else{
                          return null;
                        }
                      },
                      keyboardType: TextInputType.emailAddress,
                      style: new TextStyle(
                        fontFamily: "Poppins",
                      ),
                    ),
SizedBox(height: MediaQuery.of(context).size.height * .05),
new TextFormField(
                      decoration: new InputDecoration(
                        labelText: "Enter Password",
                        fillColor: Colors.white,
                        border: new OutlineInputBorder(
                          borderRadius: new BorderRadius.circular(10.0),
                          borderSide: new BorderSide(
                          ),
                        ),
                        //fillColor: Colors.green
                      ),
                      validator: (val) {
                        if(val.length==0) {
                          return "Password cannot be empty";
                        }else{
                          return null;
                        }
                      },
                      keyboardType: TextInputType.emailAddress,
                      style: new TextStyle(
                        fontFamily: "Poppins",
                      ),
                    ),
                ],
              ),
              )
            ),
          ),
        ),

        new Container(
          alignment: Alignment.topCenter,
          padding: new EdgeInsets.only(
              top: MediaQuery.of(context).size.height * .80,
              right: 50.0,
              left: 50.0),
          child: new FlatButton(
            color: Colors.red,
            child: Text("Press Me"),
            onPressed: () {},
          ),
        ),

        new Container(
          alignment: Alignment.topCenter,
          padding: new EdgeInsets.only(
              top: MediaQuery.of(context).size.height * .90,
              right: 50.0,
              left: 50.0),
          child: new FlatButton(
            color: Colors.red,
            child: Text("Forgot Password ?"),
            onPressed: () {},
          ),
        )   






      ],
    )
      )
    );
  }
}

После изменений клавиатура все еще появляетсянебольшое покрытие текстового поля.

enter image description here

Могу ли я достичь некоторых

enter image description here

1 Ответ

1 голос
/ 12 апреля 2019

Вы должны поместить все это в ListView, затем при открытии клавиатуры список прокрутится вверх.

...