Question 259101 in Flutter Question posted in
The official Flutter documentation can be found here.

flutter bottom text fields hidden by keyboard

I have a long Form that contains multiple textfields.
When i try to fill the last ones the keyboard hide them !
I even used SingleChildScrollView and added this line to my scaffold
resizeToAvoidBottomInset: true,
But i still have same issue
enter image description here

code:

Scaffold(
  resizeToAvoidBottomInset: true,
  backgroundColor: Colors.white,
  body: SafeArea(
    child: SingleChildScrollView(
      // reverse: false,
      //physics: const CustomScrollPhysic(),
      child: Padding(
        padding: EdgeInsets.symmetric(
          horizontal: 20.0.w,
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(
              height: 20.0.h,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                InkWell(
                  onTap: () {
                    Navigator.pop(context);
                  },
                  child: const Icon(Icons.arrow_back_ios_new_rounded),
                ),
                const Spacer(),
                Text(
                  'Profile',
                  style: TextStyle(
                    fontSize: 20.sp,
                    fontWeight: FontWeight.bold,
                    color: Colors.black,
                  ),
                ),
                const Spacer(),
              ],
            ),
            SizedBox(
              height: 60.0.h,
            ),
            EditProfileTextField(
              field: _firstNameField,
              controller: _firstNameController,
              focusNode: firstNameFocusNode,
              name: 'First name',
            ),
            EditProfileTextField(
              field: _lastNameField,
              controller: _lastNameController,
              focusNode: lastNameFocusNode,
              name: 'Last Name',
            ),
            EditProfileTextField(
              field: _emailField,
              controller: _emailController,
              focusNode: emailFocusNode,
              name: 'Email address',
            ),
            EditProfileTextField(
              field: _storeNameField,
              controller: _storeNameController,
              focusNode: storeNameFocusNode,
              name: 'Store name',
            ),
            EditProfileDropMenu(
              name: 'Store country',
              type: 'name',
              value: selectedCountry,
              data: countryData,
            ),
            EditProfileTextField(
              field: _companyNameField,
              controller: _companyNameController,
              focusNode: companyNameFocusNode,
              name: 'Company name',
            ),
            EditProfileTextField(
              field: _addressField,
              controller: _addressController,
              focusNode: addressFocusNode,
              name: 'Address',
            ),
            EditProfileTextField(
              field: _cityField,
              controller: _cityController,
              focusNode: cityFocusNode,
              name: 'City',
            ),
Tags:

2

Answers


  1. 0

    Try adding that padding to the SingleChild widget.

     padding:  EdgeInsets.only(bottom: MediaQuery.viewInsetsOf(context).bottom),
    Login or Signup to reply.
  2. 0

    Try this: Wrap you Padding in SizedBox() and give it the hight of the screen

    SingleChildScrollView(
     child: SizedBox(
          height:MediaQuery.of(context).size.height,//<<====Add this
          child: Padding(
        padding: EdgeInsets.symmetric(
          horizontal: 20.0.w,
        ),
...
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search