JSPM

react-native-onboarding-screen

1.0.3
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 3
  • Score
    100M100P100Q34210F
  • License MIT

Onboarding screen for React Native.

Package Exports

  • react-native-onboarding-screen

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-onboarding-screen) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-onboarding

Onboarding screen for React Native.

Installation

npm install --save react-native react-native-onboarding-screen

Usage

Result

Code

import React from 'react';
import Onboarding from 'react-native-onboarding-screen';

export default class App extends React.Component {
    render() {
        const Pages = [
                {
                    title: 'Welcome',
                    subtitle: 'to the Oxford Union app. Here you can browse the term card and engage with the Union, all in one place.'
                },
                {
                    title: 'Get Engaged',
                    subtitle: 'The Oxford Union app integrates closely with Facebook. Don\'t worry, we won\'t post anything to your profile.',
                    action: {
                        title: "Login to Facebook",
                        onPress: this.showFacebookLogin
                    }
                },
                {
                    title: "Great",
                    subtitle: "That's all for now. As you use the app, we'll learn about the events you like and use this to personalize your experience.",
                    action: {
                        title: "Let's Get Started",
                        onPress: this.finishOnboarding
                    }
                }
        ];
        return (
            <Onboarding
                backgroundImage={require('./Resources/onboarding.jpg')}
                pages={Pages}
            />
        );
    }
}