简体   繁体   中英

When open Keyboard shows overflow in Flutter

In my case, I have a rounded background for all inputs (attached image1) but when I click to the last TextField I get an overflow warning (attached image2) and can't scroll down.

I have tried using in Scaffold resizeToAvoidBottomInset: false but the last TextField goes under the keyboard, so it is not what I want.

my code at gist

图像1 图2

I think you need to all text field wrap in Listview widget.

wrap you code with SingleChildScrollView

SingleChildScrollView(
child:Stack(
...))

You can wrap your SingleChildScrollView widget with the Expanded widget. This is the only thing that you need.

          Form(
            key: _formKey,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.end,
              mainAxisSize: MainAxisSize.max,
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                Expanded( // Wrap with Expanded!
                  child: SingleChildScrollView(
                    child: Container(
                      padding: EdgeInsets.symmetric(
                          vertical: 16.0, horizontal: 24.0),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(32.0),
                          topRight: Radius.circular(32.0),
                        ),
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Padding(
                                padding:
                                    const EdgeInsets.symmetric(vertical: 16.0),
                                child: Text('Sign Up',
                                    style: TextStyle(
                                        fontSize: 20.0,
                                        fontFamily: 'Montserrat',
                                        fontWeight: FontWeight.bold)),
                              ),
                            ],
                          ),

在此处输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM