Skip to content

rinamasrina/react-native-announcement

Repository files navigation

react-native-announcement

A simple component to show what's new in your app. The package is both Android and iOS compatible.

Installation

npm install react-native-announcement

or

yarn add react-native-announcement

Try it out

You can run example module by performing these steps:

$ git clone git@github.com:rinamasrina/react-native-announcement.git
$ cd react-native-announcement
$ yarn
$ cd example
$ yarn ios

Available props

There are 3 mandatory props to be implemented.

  • visible
  • handleDoneButtonOnPressed
  • features

Others are optional.

Props type Description
visible boolean A boolean to show or hide the modal screen
handleDoneButtonOnPressed void A function to perform after user click Done or a button at the last screen
features array of Feature List of features that you want to show. It includes image, title, and description
titleStyle object Text style for title
descriptionStyle object Text style for description
buttonStyle object Style for button at the bottom
continueButtonTitle string Title for the first to n-1 button in the screen. Default is Next
lastIndexButtonTitle string Title for the last button in the screen. Default is Start

Usage

  1. create your Feature array object.
const FEATURES: Feature[] = [
  {
    image: require('./assets/laptop.png'),
    title: 'Stay organized',
    description: 'Get an overview of how you are performing and motivate yourself to achieve even more',
  },
  {
    image: require('./assets/travel.png'),
    title: 'Personalise your journey',
    description: 'Create unique emotional story that describes your work better than words',
  },
];
  1. Use Announcement component and add the compulsory props
import Announcement from "react-native-announcement";

// ...
export default function App() {
  return (
     <Announcement
        visible={true}
        handleDoneButtonOnPressed={handleDoneButtonOnPressed}
        features={FEATURES}
    />
    // ...
  )
}

To understand more, see the example

Contributing

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

License

MIT