简体   繁体   中英

Touchables under absolute position not working on IOS but working fine on Android

I have ScrollView that contains some touchables and beneath i have separate component that contains notifications.

<ScrollView style={styles.scroll}>
   //some touchables
</ScrollView>
<Notifications />

Notifications are 50px in height and are dragable, just like notifications on android or ios, when you pull them down, they go over the scrollview and when you swipe them up scrollview is there once again.

The problem is that when notifications are not in down position, on android (real device) i can click on touchables inside my scrollview and it all works fine, but on ios simulator, you can swipe notifications but you can not click on the touchables inside scrollview when notifications are in the up position.

I tried giving the scrollview zIndex of 1 and I can click on touchables but then when I swipe notifications down, they go beneath the scrollview.

Can anyone suggest me some solution?

scroll: {
    width: '100%',
    paddingHorizontal: '2%',
    marginTop: 50,
  },

Notifications container looks like this:

panelContainer: {
    position: 'absolute',
    top: 0,
    bottom: 0,
    left: 0,
    right: 0,
  },

Even though I was trying to find a solution for this for several hours, I think I found it just after I have posted this question.

The solution for this was to add pointerEvents="box-none" to a View that was positioned absolute. Now it works as it should both on Android and IOS.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM