1.0.0 • Published 2 years ago

react-native-animated-custom-toast v1.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

Custom React Native Toast

This is a toast package for reac native. it is easy to implement and develpoers can customized it accordingly.

Installation

    $ npm i react-native-animated-custom-toast

Usage

  1. Import react-native-animated-custom-toast:
    import Toast from "react-native-animated-custom-toast";
  1. Create ref for toast
    const toastRef = useRef(null);
  1. Create a component in return part and pass required props with toast ref which is mandatory
    <Toast
        toastColor={"red"}
        toastTextColor={"white"}
        toastMessage={"Hello from toast"}
        ref={toastRef}
        iconTintColor:"white"
    />
  1. Trigger toast whenever required with the help of toast ref
    toastRef.current.showToast();

Complete Example

import React, { useRef } from "react";
import { Button, View } from "react-native";
import Toast from "react-native-animated-custom-toast";

const App = () => {
    const toastRef = useRef(null); 

    return (
        <View style={{ flex: 1 }}>
            <Button title="Show Toast" onPress={()=>{toastRef.current.showToast();}} />
            <Toast
                toastColor={"red"}
                toastTextColor={"white"}
                toastMessage={"Hello from toast"}
                ref={toastRef}
                iconTintColor:"white"
            />
        </View>
    );
}

export default App;
1.0.0

2 years ago