Touches pass through overlay Views in Android, but not iOS

[semekh]

Description

There is a discrepancy between event propagation in iOS and Android.

On Android: You can have have two "overlay" views that span the whole view, containing some control elements. All control elements are tappable, as long as they don't overlap.

On iOS: The same configuration results in the top view acting like a glass that prevents any interaction with the elements on the bottom view.

In other words, transparent Views do propagate touch events to underlying Views in Android, but not in iOS.

I personally prefer Android's behavior.

Reproduction

https://snack.expo.io/SkBZGASx-

On Android: You can tap on both the green and red box. On iOS: You can only tap on the green box.

Solution

Add pointerEvents='box-none' to overlay Views. https://snack.expo.io/BkVomRrlb

Additional Information

• React Native version: 0.44
• Platform: both iOS and Android
• Operating System: N/A