Pull to refresh hidden behind renderParallaxForeground component

[ashokkumar88]

Issue details

I am using FlatList in renderScrollComponent and inside renderParallaxForeground i am using a Swiper component. When I am using the Pull to Refresh the loading icon is going behind the renderParallaxForeground component.Seems some zIndex issue.

Steps to reproduce

Use a normal View with height 300 and some background color inside renderParallaxForeground and renderScrollComponent={FlatList}. Use the Pull to Refresh.

Please specify which versions of the RN and ParallaxScroll

• react-native 0.51
• react-native-parallax-scroll 1.5.4

Affected platforms

• Android
• iOS (not checked)

Screenshots / Screencast / Code Snippets (Optional)

<ParallaxScroll
      scrollableComponent={FlatList}
      renderHeader={({ animatedValue }) => <Header/>
    } 
      headerHeight={MARGIN_TOP}
      isHeaderFixed={false}
      fadeOutParallaxBackground={false}
      fadeOutParallaxForeground={true}
      parallaxHeight={300}
     renderParallaxForeground={({ animatedValue }) =>
  <Swiper/>
  }

//     } 
      parallaxBackgroundScrollSpeed={5}
      parallaxForegroundScrollSpeed={1.3}      
      data={this.props.list}
      keyExtractor={this._keyExtractor}
      renderItem={this._renderItem}
      initialNumToRender={6}
      onRefresh={this.handleRefresh}
      refreshing={this.state.refreshing}
    />

[Lizhooh]

+1, This is indeed a problem.

[z4o4z]

Hi @ashokkumar88, looks like this issue can't be fixed, it is connected with RN limitations

[geminiyellow]

something working?

[wisungyo]

i also face this issue. loading indicator shows behind my component I set to be a header.