Skip to content

Notifly allows you to show application notifications within the application and with your own components

License

Notifications You must be signed in to change notification settings

firuzcanh/react-native-notifly

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Notifly

React Native Notifly

Notifly allows you to show application notifications within the application and with your own components

Installation

npm install --save react-native-notifly

Usage

First you have to add Notifly to App

//App.js
import React from "react";
import { Notifly } from "react-native-notifly";

export default function App() {
  return (
    <View>
      {/* ... */}
      <Notifly />
    </View>
  );
}

After that just you need to call `fire` methods from anywhere in your app. 🎉

Show notification

import React from "react";
import { Button } from "react-native";
import { fire } from "react-native-notifly";

export default function ExampleScreen() {
  return (
    <Button
      title="Fire Notification"
      onPress={() =>
        fire({
          title: "Title",
          message: "Some text message",
          avatar: { uri: "image url" },
          options: {
            behaviour: "swipe",
            duration: 2000,
          },
          onPress: (args) => console.log(args),
        })
      }
    />
  );
}

You can use Notifly with your own components. See below example


export default function ExampleScreen() {
  return (
    <Button
      title="Fire Notification"
      onPress={() =>
        fire({
          title: "Title",
          message: "Some text message",
          component: (args) => (
            <View>
              <Text>{args.title}</Text>
            </View>
          ),
        })
      }
    />
  );
}

Fire Props

Property Default Description
title none Title of notification
message none Message of notification
avatar none Avatar icon of notification
onPress none onPress callback for notification press
component none Set a your custom component
options FireOptions Notification options

FireOptions

Property Default Description
behaviour swipe The behaviour prop set the behaviour of notification. You can use one of them. swipe, clear, over
duration 2000 The duration prop set the notification duration.

Notifly

License

MIT

About

Notifly allows you to show application notifications within the application and with your own components

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published