'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
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 |