All Projects → testshallpass → React Native Dropdownalert

testshallpass / React Native Dropdownalert

Licence: mit
A simple alert to notify users about new chat messages, something went wrong or everything is ok.

Programming Languages

javascript
184084 projects - #8 most used programming language
Starlark
911 projects
objective c
16641 projects - #2 most used programming language
java
68154 projects - #9 most used programming language
ruby
36898 projects - #4 most used programming language

Projects that are alternatives of or similar to React Native Dropdownalert

notice.js
💯 Javascript notification library
Stars: ✭ 25 (-98.46%)
Mutual labels:  alert, notification
Swiftentrykit
SwiftEntryKit is a presentation library for iOS. It can be used to easily display overlays within your iOS apps.
Stars: ✭ 5,706 (+250.49%)
Mutual labels:  alert, notification
janitor
Availability monitoring and alerting for IOT devices
Stars: ✭ 55 (-96.62%)
Mutual labels:  alert, notification
growl-alert
A simple growl like notification system.
Stars: ✭ 14 (-99.14%)
Mutual labels:  alert, notification
Gcnotificationview
Simplest notification alert view for iOS
Stars: ✭ 27 (-98.34%)
Mutual labels:  alert, notification
snmp notifier
A webhook to relay Prometheus alerts as SNMP traps, because sometimes, you have to deal with legacy
Stars: ✭ 33 (-97.97%)
Mutual labels:  alert, notification
React Cool Portal
😎 🍒 React hook for Portals, which renders modals, dropdowns, tooltips etc. to <body> or else.
Stars: ✭ 458 (-71.87%)
Mutual labels:  dropdown, notification
SpaceView
No description or website provided.
Stars: ✭ 58 (-96.44%)
Mutual labels:  alert, dropdown
Notie
🔔 a clean and simple notification, input, and selection suite for javascript, with no dependencies
Stars: ✭ 6,170 (+278.99%)
Mutual labels:  alert, notification
React Useportal
🌀 React hook for Portals
Stars: ✭ 698 (-57.13%)
Mutual labels:  dropdown, notification
Notiflix
Notiflix is a JavaScript library for client-side non-blocking notifications, popup boxes, loading indicators, and more that makes your web projects much better.
Stars: ✭ 172 (-89.43%)
Mutual labels:  alert, notification
Notificationbar
A simple module for iOS that allows you to show notifications strips
Stars: ✭ 40 (-97.54%)
Mutual labels:  alert, notification
Vue Toastify
🔥 Simple, extendable, dependency free notification plugin. 🔥
Stars: ✭ 126 (-92.26%)
Mutual labels:  alert, notification
JDropDownAlert
Simple DropDown Alert View For Any iOS Projects.
Stars: ✭ 71 (-95.64%)
Mutual labels:  alert, dropdown
Fftoast
A very powerful iOS message notifications and AlertView extensions. It can be easily realized from the top of the screen, the bottom of the screen and the middle of the screen pops up a notification. You can easily customize the pop-up View.
Stars: ✭ 649 (-60.14%)
Mutual labels:  alert, notification
React Notie
Simple notifications for react
Stars: ✭ 27 (-98.34%)
Mutual labels:  alert, notification
Ng Bootstrap
Angular powered Bootstrap
Stars: ✭ 7,872 (+383.54%)
Mutual labels:  alert, dropdown
Custom Reactjs Dropdown Components
Custom dropdown components for ReactJS
Stars: ✭ 110 (-93.24%)
Mutual labels:  dropdown
Jxpopupview
一个轻量级的自定义视图弹出框架
Stars: ✭ 117 (-92.81%)
Mutual labels:  alert
Laravel Alert
A Bootstrap alert helper for Laravel
Stars: ✭ 110 (-93.24%)
Mutual labels:  alert

react-native-dropdownalert

Platform npm version npm version Build Status codecov License

info warn error success
screenshot screenshot screenshot screenshot

Table of contents

  1. Support
  2. Installation
  3. Demo
  4. Usage
  5. Props
  6. Caveats

An alert to notify users about new chat messages, something went wrong or everything is okay. It can be closed by tap, cancel button, automatically with closeInterval, pan responder up gesture or programmatically (this.dropDownAlertRef.closeAction()).

Support

react-native version package version reason
0.50.0 >=3.2.0 Included SafeAreaView (iPhone X)
0.44.0 >=2.12.0 Adopted ViewPropTypes

Installation

  • npm i react-native-dropdownalert --save
  • yarn add react-native-dropdownalert

Demo

screenshot

Usage

import DropdownAlert from 'react-native-dropdownalert';
export default class App extends Component {
  componentDidMount() {
    this._fetchData();
  }
  _fetchData = async () => {
    try {
      // alertWithType parameters: type, title, message, payload, interval.
      // payload object that includes a source property overrides the image source prop. (optional: object)
      // interval takes precedence over the closeInterval prop. (optional: number)
      this.dropDownAlertRef.alertWithType('info', 'Info', 'Start fetch data.');
      await fetch('https://httpbin.org/get');
      this.dropDownAlertRef.alertWithType('success', 'Success', 'Finish fetch data');
    } catch (error) {
      this.dropDownAlertRef.alertWithType('error', 'Error', error);
    }
  };
  render() {
    // DropdownAlert must be last component in the document tree.
    // This ensures that it overlaps other UI components.
    return (
      <View>
        <DropdownAlert ref={ref => this.dropDownAlertRef = ref} />
      </View>
    );
  }
}

Caveats

Inspired by: RKDropdownAlert

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].