Carousel
The Carousel component is a user interface element that enables the display of multiple items in a horizontally scrollable format. It is often used for showcasing products, features, or announcements.
Component Visuals
To unlock early access to the component Get Access
In this video, you'll learn:
How to use the component.
Customization options for the Carousel component.
Installation
To install the Quest react-native-native-sdk
into your project, follow these steps:
Open your terminal/command prompt.
Navigate to your project's root directory using the
cd
command if you're not already there.Run the following command to install the
quest-sdk
package using npm:
This command will download and install the package and its dependencies into your project.
Make sure your project has npm and Node.js installed, and that you have the necessary permissions to install packages in your project directory.
Props of Login Component
The Carousel
component accepts the following props
Prop Name | Type | Required | Details |
---|---|---|---|
data | ItemType | requried | The Data for items for the carousel |
mainView | ViewStyle | optional | The BackGround View of the Carousel. |
dotStyle | ViewStyle | optional | The dot Style of the Carousel. |
dotViewStyle | ViewStyle | optional | The dot View Style. |
detailsTextStyle | TextStyle | optional | The details Text Style of the Component. |
detailViewStyle | ViewStyle | optional | The details Text View Style of the Component. |
headerTextStyle | TextStyle | optional | The header Text Style of the Component. |
headerViewStyle | ViewStyle | optional | The header View Style of the Component. |
imageStyle | imageStyle | optional | The Image Style of the Component. |
imageViewStyle | ViewStyle | optional | The Image View Style of the Component. |
componentViewStyle | ViewStyle | optional | The Carousel Component Style. |
innerViewStyle | ViewStyle | optional | The Back Ground style Of the Carousel Component. |
Usage
To integrate the Carousel component into your React application, follow these steps
Import the Carousel Component: Import the Tutorial component from the
@questlabs/react--native-sdk
package.
Example Usage
Here's an example of how to use the Daily Visit Streak component within your React Native application.
The above example not uses all the props.
Last updated