react-native-paper icon indicating copy to clipboard operation
react-native-paper copied to clipboard

Add default pointer event for Surface iOS

Open quocluongha opened this issue 1 year ago • 0 comments

Is your feature request related to a problem? Please describe. I was making a collapsible header scrollable (For example: ScrollView, FlatList). The header is rendered with absolute style and the content of the scrollable will have a padding value based on header height. With this method of rendering I need to set pointerEvents prop of children of the header either to box-none or none for non-touchable component so that the header is able to receive scroll gesture. Everything was working fine until I used Surface component, things behaved a little different between Android and iOS:

  • Android: working as expected when setting pointerEvents prop to box-none or none
  • iOS: not working when setting pointerEvents prop to box-none or none

Describe the solution you'd like I dig into Surface component source code and I found out the SurfaceIOS component actually renders 2 layers of View instead of 1 on other platforms. And the pointerEvents prop is only forwarded to the inner layer View. After I set pointerEvents prop of the outer layer View to box-none and it was working on iOS.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context image

quocluongha avatar Sep 30 '23 08:09 quocluongha