search

deanhet / react-native-text-ticker

React Native Text Ticker/Marquee Component
MIT License
444 stars 75 forks source link

Not working on React Native Web #77

Closed marinimau closed 4 years ago

marinimau commented 4 years ago

When I use the component on the web the animation never starts

deanhet commented 4 years ago

Assuming you mean this repo?: https://github.com/necolas/react-native-web

react-native-text-ticker relies heavily on the Animated module, I can see from the readme of react-native-web that useNativeDriver is not supported yet.

Can you try again but add useNativeDriver={false} as a prop on the text ticker component?

If that doesn't work, react-native-text-ticker aims to only support the latest version of react-native. react-native-web may be incorrectly translating some code / have an incompatible implementation with what react-native is doing behind the scenes. I'd be happy to accept a pull-request if you manage to find the cause of the issue.

marinimau commented 4 years ago

found the issue!

On the web the TextTicker container goes to the 100% of the width of the scrollview (the one used in the component implementation). The problem is that the scrollview on the web fits the content width (no overflow no scroll). Using width: '100%' on the textTicker component the problem remains.

I've fixed this issue adding:

{width: (windowWidth > dimens.largeScreen ? windowWidth - dimens.drawerWidth : windowWidth)}

in style prop, where windowWidth is:

Dimensions.get("window").width