1

I'm having some friends test an app of mine and on one of their devices, when the keyboard is open, it hides part of the UI (a checkbox). This screenshot shows the issue (my code below):

enter image description here

Below my relevant code from the modal bottom sheet. I'm not using 100% of the view insets, as I'm fine with some part of the sheet being covered. The 0.38 is the value that produces both results form the screenshot. How can I make this consistent across devices?

return StatefulBuilder(
    builder: (BuildContext context, StateSetter setModalState) {
  return Padding(
    padding: MediaQuery.of(context).viewInsets * 0.38,
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: [//irrelevant
          ],
Joe
  • 311
  • 3
  • 17

1 Answers1

0

You have to use padding:EdgeInsets.fromLTRB(0, 0, 0, MediaQuery.viewInsetsOf(context).bottom),

In here, LTRB means Left, Top, Right, Bottom. When in bottom you use MediaQuery.viewInsetsOf(context).bottom) your UI will be on top of Keyboard.

abdullah_bd
  • 484
  • 3
  • 12