How to do background overlay without opacity?

Hey,

I’m using this lib for Android, and I know a lot of sidebar menus have a black semi-transparent overlay behind the menu but above the initial content.

I’ve tried doing this with the tweenHandler thats in the docs (via opacity), but the problem is all my position: absolute elements all switch to semi-transparent, and creates tons of discordance and confusion because every single element becomes semi see-through rather than a black semi-transparent black overlay on top.

Do you have any idea how I could solve this?

[dgladkov]

This is possible with version 2.0.0-wip1. Example:

<Drawer
...
  styles={{
    mainOverlay: {
      backgroundColor: 'black',
      opacity: 0,
    },
  }}
  tweenHandler={(ratio) => ({
    mainOverlayProps: {
      opacity: ratio / 2,
    },
>

Example above has a black overlay that will become half transparent when drawer is fully open.

[lastant]

Should be mainOverlay instead of mainOverlayProps.