Fix Animated.event type so it can be used in `Animated.ScrollView` `onScroll` props (& similar) by MoOx · Pull Request #584 · rescript-react-native/rescript-react-native
…imated.ScrollView` `onScroll` props (& similar)
According to RN docs (and experience) it's handy to be able to use `Animated.event` to map `onScroll` event directly to an `Animated.Value`.
Currently the bindings make this impossible as if you try to do this
```reason
open ReactNative;
let styles = Style.(StyleSheet.create({"container": style(~flex=1., ())}));
type renderArgs = {
scrollYAnimatedValue: Animated.Value.t,
scrollViewRef:
React.Ref.t(Js.Nullable.t(ReactNative.Animated.ScrollView.element)),
};
[@react.component]
let make =
(
~style as s=?,
~contentContainerStyle=?,
~children: renderArgs => React.element,
) => {
let scrollViewRef = React.useRef(Js.Nullable.null);
let (scrollYAnimatedValue, _setScrollYAnimatedValue) =
React.useState(() => Animated.Value.create(0.));
<Animated.ScrollView
ref=scrollViewRef
style=Style.(arrayOption([|Some(styles##container), s|]))
?contentContainerStyle
scrollEventThrottle=1
onScroll={Animated.event(
[|{
"nativeEvent": {
"contentOffset": {
"y": scrollYAnimatedValue,
},
},
}|],
{"useNativeDriver": true},
)}
showsVerticalScrollIndicator=false
showsHorizontalScrollIndicator=false>
{children({scrollYAnimatedValue, scrollViewRef})}
</Animated.ScrollView>;
};
```
You will get an error like this
```
We've found a bug for you!
......./AnimatedScrollView.re 21:14-30:6
19 ┆ ?contentContainerStyle
20 ┆ scrollEventThrottle=1
21 ┆ onScroll={Animated.event(
22 ┆ [|{
. ┆ ...
29 ┆ {"useNativeDriver": true},
30 ┆ )}
31 ┆ showsVerticalScrollIndicator=false
32 ┆ showsHorizontalScrollIndicator=false>
This has type:
ReactNative.Animated.animatedEvent (defined as
ReactNative.Animated.animatedEvent)
But somewhere wanted:
ReactNative.Event.scrollEvent => unit
```
Which is valid!
This change make this valid (tested in the app I currently work on).