Can I put renderScrollComponent as options about react-native-timeline-listview

[harrymelka]

This was the test with the renderScrollComponent method

renderParallaxScrollView(props) {
  		return (
  			<ParallaxScrollView
  				stickyHeaderHeight={ STICKY_HEADER_HEIGHT }
  				parallaxHeaderHeight={ parallaxHeight }
  				backgroundSpeed={10}

  				renderBackground={() => (
  					<View key="background">
  						<Image
  							source={{uri: 'https://scontent-cdg2-1.xx.fbcdn.net/v/t1.0-9/11703082_10155826687875565_6900322515805023661_n.jpg?oh=eaef4fae86c2e04fc77db21ce078271d&oe=5A00BB2F'}}
  							resizeMode={'cover'}
  							style={{height: parallaxHeight, width: window.width}}
  						/>
  						<View
  							style={{position: 'absolute',
  								top: 0,
  								width: window.width,
  								backgroundColor: 'rgba(0,0,0,.4)',
  								height: parallaxHeight
  							}}
  						/>
  					</View>
  				)}

  				renderForeground={() => (
  					<BannerCard key="parallax-header" data={this.state.list[0]} />
  				)}

  				renderStickyHeader={() => (
  					<BannerCard key="fixed-header" data={this.state.list[0]} fixed />
  				)}
  			/>
  		)
  	}

  render() {
    return (
      <View style={styles.container}>

        <Timeline
          style={styles.list}
          data={this.state.data}
          circleSize={20}
          circleColor='rgb(45,156,219)'
          lineColor='rgb(45,156,219)'
          timeContainerStyle={{minWidth:52, marginTop: -5}}
          timeStyle={{textAlign: 'center', backgroundColor:'#1abc9c', color:'white', padding:5, borderRadius:13}}
          descriptionStyle={{color:'gray'}}
          options={{
            style:{paddingTop:0},
            refreshControl: (
              <RefreshControl
                refreshing={this.state.isRefreshing}
                onRefresh={this.onRefresh}
              />
            ),
            renderFooter: this.renderFooter,
            onEndReached: this.onEndReached,
            renderDetail: this.renderDetail,
            //renderScrollComponent={this.renderParallaxScrollView.bind(this)}
            renderParallaxScrollView: this.renderParallaxScrollView
          }}

          renderDetail={this.renderDetail}
          renderParallaxScrollView={this.renderParallaxScrollView}

          innerCircle={'dot'}
        />
      </View>
    );
  }

[thegamenicorus]

Hi @harrymelka

Yes, you can use renderScrollComponent in options. I try it and it's work with ParallaxScrollView.
my code::

renderParallaxScrollView(props){
    return (
    <ParallaxScrollView
      backgroundColor="blue"
      contentBackgroundColor="pink"
      parallaxHeaderHeight={300}
      renderForeground={() => (
       <View style={{ height: 300, flex: 1, alignItems: 'center', justifyContent: 'center' }}>
          <Text>Hello World!</Text>
        </View>
      )}>
      <View style={{ height: 500 }}>
        <Text>Scroll me</Text>
      </View>
    </ParallaxScrollView>
    )
  }

  render() {
    return(
      <Timeline 
          data={this.data}
          innerCircle={'dot'}
          options={{
            renderScrollComponent: this.renderParallaxScrollView,            
          }}
        />
    )

ps. refreshControl option might not work with ParallaxScrollView.

[harrymelka]

Thank you ! I will try it and tell you if I could add the refreshControl