React Native Marquee

animatereactnative-marquee.mp4

React Native Marquee component, a cross-platform marquee component, powered by Reanimated:

  • ? Powered by Reanimated 3
  • ? Works with Expo
  • ✅ Cross-platform (iOS, Android, Web)
  • ⚡️ 60-120fps
  • ? Works with any React Native element/component
  • ⌨️ Written in TypeScript

Installation

npm install @animatereactnative/marquee

Also, you need to install react-native-reanimated, and follow their installation instructions.

Usage

import { Marquee } from '@animatereactnative/marquee';

// ...

export function Example() {
  return (
    <Marquee spacing={20} speed={1}>
      <Heading>Powered by AnimateReactNative.com</Heading>
    </Marquee>
  );
}

Props

name description required type default
children Any component that you’d like to apply infinite scrolling / marquee effect YES React.ReactNode 1
speed Animation speed NO number 1
spacing Spacing between repeting elements NO number 0
style View style to be applied to Marquee container. NO StyleProp<ViewStyle>

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

GitHub

View Github