'How to remove space between keyboard and comment box in flutter?

I can't remove the space between the comment box and the keyboard.

Please see the below image for the issue

issue image

and below is my code

floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      floatingActionButton: Padding(
        padding: const EdgeInsets.all(1.0),
        child: SizedBox(
          height: 48,
          child: TextFormField(
            decoration: InputDecoration(
              suffixIcon: SizedBox(
                width: 90,
                child: Padding(
                  padding: const EdgeInsets.all(13.0),
                  child: Row(
                    children: [

                      const SizedBox(width: 40),
                      RichText(
                          text: const TextSpan(children: [
                        WidgetSpan(
                          child: SizedBox(
                              height: 20,
                              width: 20,
                              child: Icon(
                                Icons.send_outlined,
                                color: AppColors.appColor0,
                              )),
                        )
                      ])),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ),

Please tell me what mistake I am doing. thank you.



Solution 1:[1]

You should set resizeToAvoidBottomInset: false and dynamically add your padding based on is keyboad open or not. Something like this:

@override
  Widget build(BuildContext context) {
    bool isKeyboardOpen = MediaQuery.of(context).viewInsets.bottom > 0;
    return Scaffold(
      resizeToAvoidBottomInset: false,
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      floatingActionButton: Padding(
        padding: isKeyboardOpen
            ? EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom)
            : const EdgeInsets.all(1.0),
        child: SizedBox(
          height: 48,
          child: TextFormField(
            decoration: InputDecoration(
              suffixIcon: SizedBox(
                width: 90,
                child: Padding(
                  padding: const EdgeInsets.all(13.0),
                  child: Row(
                    children: [
                      // Image.asset("assets/images/home_icon/mic.png"),
                      const SizedBox(width: 40),
                      RichText(
                          text: const TextSpan(children: [
                        WidgetSpan(
                          child: SizedBox(
                              height: 20,
                              width: 20,
                              child: Icon(
                                Icons.send_outlined,
                              )),
                        )
                      ])),
                      // Image.asset("assets/images/home_icon/send.png"),
                    ],
                  ),
                ),
              ),
              prefixIcon: Padding(
                padding: const EdgeInsets.all(13.0),
                child: RichText(
                    text: const TextSpan(children: [
                  WidgetSpan(
                    child: SizedBox(
                        height: 20,
                        width: 20,
                        child: Icon(
                          Icons.photo_camera_outlined,
                        )),
                  )
                ])),
              ),
              hintText: 'Add comments...',
              // hintStyle: NewStyles.textValueGreyR14,
              filled: true,
              fillColor: Colors.white,
              contentPadding:
                  const EdgeInsets.symmetric(horizontal: 30, vertical: 0),
              focusedBorder: OutlineInputBorder(
                // borderSide: const BorderSide(color: AppColors.appColor2),
                borderRadius: BorderRadius.circular(100),
              ),
              enabledBorder: OutlineInputBorder(
                // borderSide:
                //     const BorderSide(color: ApplicationColors.chatBGcolorEE),
                borderRadius: BorderRadius.circular(100),
              ),
              errorBorder: OutlineInputBorder(
                borderSide: BorderSide(color: Theme.of(context).errorColor),
                borderRadius: BorderRadius.circular(100),
              ),
            ),
          ),
        ),
      ),
      body: SafeArea(
        child: SizedBox(),
      ),
    );
  }

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ante Bule