carousel-react-native

A React Native library for integrating Green Video Carousel into your React Native applications. Supports both Android and iOS platforms.

Installation

npm install @xymatic/carousel-react-native

Usage

Custom handler for card selection allows to align the feed with the application design and navigation. Card's url and GreenFeedView allows to add feed's contents to any screen in hosting application's style. Default selection behavior would be disabled.

import { GreenCarouselView } from "@xymatic/carousel-react-native";

<GreenCarouselView
  license="your-license-key"
  embed="your-embed-id"
  onSelect={(cardUrl) => {
    navigation.navigate('ContentScreen', { cardUrl });
  }}
/>

Display selected feed:

import { GreenFeedView } from "@xymatic/carousel-react-native";

<GreenFeedView
  cardUrl={videoUrl}
  onReady={() => console.log('Feed is ready')}
  onClose={() => navigation.goBack()}
/>

API Reference

GreenCarousel

| Parameter | Type | Required | Description | |-----------|------|----------|-------------| | license | string | Yes | Your Green Video license key | | embed | string | Yes | Embed ID for the carousel | | environment | string | No | 'production' or 'staging' for selecting the environment| | onSelect | (cardUrl: string) => void | No | Callback when a video is selected. Receives the card URL | | style | ViewStyle | No | Style object for the carousel container |

GreenFeed

| Parameter | Type | Required | Description | |-----------|------|----------|-------------| | cardUrl | string | Yes | URL of the video card to display | | onReady | () => void | No | Callback when the feed is ready | | onClose | () => void | No | Callback when the feed is closed | | style | ViewStyle | No | Style object for the feed container |

Platform Support

• ✅ Android
• ✅ iOS

Contributing

• Development workflow
• Sending a pull request
• Code of conduct

License

MIT

Made with create-react-native-library