Stay informed
Subscribe to our newsletter if you'd like to stay informed about Shoutem Extensions and Shoutem UI Toolkit.
Fades in components wrapped by it.
driver
: Driver that is running the animationchildren
: Components that will be affected by the animationinputRange
: Array [from, to]
including a 'from' animated value
and 'to' animated value
const driver = new ScrollDriver();
return (
<ScrollView
{...driver.scrollViewProps}
>
<FadeIn
driver={driver}
inputRange={[100,150]}
>
<Image />
</FadeIn>
</ScrollView>
);
The above code will create a scroll dependent fade in animation over Image
component from scroll position 100 to scroll position 150 where Image
is fully transparent at scroll position 100 and opaque at scroll position 150.