Skip to content

Hey developers!! Is your Network disconnected? Then use this awesome React Native package to show the message.

License

Notifications You must be signed in to change notification settings

prabureddy/react-native-network-checker

Repository files navigation

react-native version npm version npm downloads

react-native-network-checker Bhargava Prabu Reddy M

Quick start

Installation

npm install --save react-native-network-checker

React Native Network Checker uses @react-native-community/netinfo as a main dependency.

Important - Dont forget this step

This packages uses @react-native-community/netinfo as a dependency.

That's it. you're ready to go.

Basic Usage

import React from 'react';
import {
  StyleSheet,
  View,
  Text,
} from 'react-native';
import NetworkChecker from 'react-native-network-checker';

const App = () => {
  return (
    <NetworkChecker
      position="bottom"
      duration={2000} // In milliseconds
      notConnectedMessage="Not connected to Internet!"
      notConnectedTextColor="white"
      notConnectedBackgroundColor="grey"
      connectedMessage="Connected to Internet!"
      connectedTextColor="white"
      connectedBackgroundColor="green"
    >
      <View style={styles.screen}>
        <Text>React Native Network Checker</Text>
      </View>
    </NetworkChecker>
  );
};

const styles = StyleSheet.create({
  screen: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});

export default App;

Props

Prop Type Description Default
position string top or bottom, Component to display bottom
duration number Milliseconds to display connected to Internet text 5000
style object Style object {}
connectedMessage string Message to show when connected to internet Back Online
connectedTextColor string Color of text when connected to internet white
connectedBackgroundColor string Backgroundcolor of container when connected to internet green
notConnectedMessage string Message to show when not connected to internet No Connection
notConnectedTextColor string Color of text when not connected to internet white
notConnectedBackgroundColor string Backgroundcolor of container when not connected to internet grey

Contribution

Contribution are welcome!. Please see the contributing guide

Questions

Feel free to Contact me or Create an issue

License

Released under the Mit License

About

Hey developers!! Is your Network disconnected? Then use this awesome React Native package to show the message.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published