Credits Popup Component
The Credit Component is a versatile tool for managing and displaying credits in your application or project. It allows you to keep track of credits.
Component Visuals
To unlock early access to the component Get Access
Demo
In this video, you'll learn:
How to use the component.
Customization options for the Credit 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.
Usage
To integrate the Credit component into your React application, follow these steps
Import the Credit Component: Import the Tutorial component from the
@questlabs/react--native-sdk
package.
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 Credit Component
The Credit
component accepts the following props
Prop Name | Type | Required | Details |
---|---|---|---|
creditTitleText | string | optional | The Credit Title Text. |
creditNumber | number | required | The Credit Number. |
buttonText | string | optional | The Buy Button Text |
upgradeText | string | optional | The Upgrade Button Text. |
helpText | string | optional | The Help Button Text. |
successTitleText | string | optional | The Success Title Text. |
successDescriptionText | string | optional | The Success Description Text. |
buttonViewStyle | ViewStyle | optional | The Buttons Outer View. |
buttonInnerViewStyle | ViewStyle | optional | The Button Inner View. |
buttonTitleTextStyle | TextStyle | optional | The Button Title Text Style. |
creditViewStyle | ViewStyle | optional | The Credit View Style. |
creditTitleTextStyle | TextStyle | optional | The Credit Title Text Style. |
buyButtonViewStyle | ViewStyle | optional | The Buy Button View. |
buyButtonTextStyle | TextStyle | optional | The Buy Button Text. |
centeredView | ViewStyle | optional | The Modal Outer View. |
modalView | ViewStyle | optional | The Modal View. |
crossIconViewStyle | ViewStyle | optional | The Cross View Style. |
modalInnerViewStyle | ViewStyle | optional | The Modal inner Style. |
modalText | TextStyle | optional | The Modal Title Text |
descritionTextStyle | TextStyle | optional | The Modal Description Text. |
successImageStyle | ImageStyle | optional | The Image Style. |
onBuy | Function | optional | Create your Own Buy Function. |
onUpgrade | Function | optional | Create your Own Upgrade Function. |
onHelp | Function | optional | Create your Own Help Function. |
Example Usage
Here's an example of how to use the Credit component within your React Native application.
The above example not uses all the props.
Last updated