Improve overInsetBottom for layers solely anchored to the bottom of the screen

lukasm

When setting overInsetBottom to true on a layer (i.e. a button) that is anchored at the bottom of the screen, the soft nav-/gesturebar will overlap that button.
Increasing the height of the button is not an option, since the navbar can have different heights depending on the device, i.e. "0" on older iPhones, just a few pt on phones with gesture bars and quite a few more on phones with soft navbars like here:
Android

Maybe it would be possible to add some kind of additional field that allows the layer to be anchored to the navbar but automatically grow below the navbar to cover it entirely.

f19benjamin

This is the expected behavior because the "overInsetBottom" explicitly moves a layer in the unsafe zone. To achieve a uniform look at the bottom it is possible to add a color layer below the button.

[
 {
  "type": "container",
  "name": "nextButton",
  [...],
  "constraints": [
   {
    "type": "pos",
    "anchor": "sw",
    "relativeAnchor": "sw",
    "x": 0,
    "y": 0
   },
   {
    "type": "size",
    "width": "100%",
    "height": "40pt",
   }
  ]
 },
 {
  "type": "color",
  "value": "<button background color>",
  "overInsetBottom": true,
  "constraints": [
   {
    "type": "pos",
    "relativeTo": "nextButton",
    "relativeAnchor": "sw",
    "x": 0,
    "y": 0
   },
   {
    "type": "pos",
    "anchor": "se",
    "relativeAnchor": "se",
    "x": 0,
    "y": 0
   }
  ]
 }
]