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

How to detect if iOS or Android device has HomeBar at the bottom of device in flutter

Device with HomeBar need some spacing on the bottom of the page. So, we need to check if device has homebar so that we can give the padding accordingly.

How to know if device has HomeBar in flutter?

enter image description here

Tags:

3

Answers


  1. 0

    You can use the SafeArea widget to easily wrap your content and avoid the bottom insets.

    To actually get the size, you can use MediaQuery.of(context).viewInsets and check its bottom insets. (You do not need to do this, if you just want to add padding. Use SafeArea like I mentioned above.)

    Login or Signup to reply.
  2. 0

    You can use MediaQuery.of(context).padding.bottom and perform a certain action if it is non-zero. For example

    if (MediaQuery.of(context).padding.bottom > 0) {
  // homebar is present
} else {
  // homebar is not present
}

    Or you can use MediaQuery.of(context).viewInsets.bottom. Both MediaQuery.of(context).padding.bottom and MediaQuery.of(context).viewInsets.bottom will give you the same result, but using viewInsets.bottom is more accurate since it takes into account any system UI elements that may be present, such as the keyboard, not just the home bar.

    Login or Signup to reply.
  3. 0 
    SafeArea()

    A widget that insets its child by sufficient padding to avoid intrusions by the operating system.

    For example, this will indent the child by enough to avoid the status bar at the top of the screen.

    It will also indent the child by the amount necessary to avoid The Notch on the iPhone X, or other similar creative physical features of the display.

    When a minimum padding is specified, the greater of the minimum padding or the safe area padding will be applied.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search