Closed monolithed closed 6 years ago
Hi @monolithed! Yep, renderHeader
method gets this object { width, height, animatedValue }
as parameter, so, you can use animatedValue
to make interpolation. The code will be something like that:
return (
<ParallaxScroll { ...header }
renderHeader={({ animatedValue }) => {
const backgroundColor = animatedValue.interpolate({
inputRange: [0, parallaxBackgroundHeight],
outputRange: ['rgba(255, 0, 0, 1)', 'rgba(255, 0, 0, 0)'],
});
return (
<TouchableOpacity onPress={ this.onReset } style={{ backgroundColor }} >
<Icon style={ styles.backControl } name='ios-arrow-back' />
</TouchableOpacity>
);
}}
renderParallaxBackground={ () => {
return <Image style={ styles.image } source={{ uri: image }} />;
}}
>
{ this.showSearchResults() }
</ParallaxScroll>
);
@z4o4z, wow, thank you so much!
Is there any way to change styles (red color) when view is scrolling?