├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── README.zh.md ├── examples ├── .buckconfig ├── .eslintrc.js ├── .flowconfig ├── .gitattributes ├── .gitignore ├── .prettierrc.js ├── .watchmanconfig ├── App.js ├── Screenshots │ └── react-native-easy-toast-screenshots.gif ├── ToastTest.js ├── __tests__ │ └── App-test.js ├── android │ ├── app │ │ ├── _BUCK │ │ ├── build.gradle │ │ ├── build_defs.bzl │ │ ├── debug.keystore │ │ ├── proguard-rules.pro │ │ └── src │ │ │ ├── debug │ │ │ ├── AndroidManifest.xml │ │ │ └── java │ │ │ │ └── com │ │ │ │ └── examples │ │ │ │ └── ReactNativeFlipper.java │ │ │ └── main │ │ │ ├── AndroidManifest.xml │ │ │ ├── java │ │ │ └── com │ │ │ │ └── examples │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── res │ │ │ ├── mipmap-hdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-mdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xxhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ ├── mipmap-xxxhdpi │ │ │ ├── ic_launcher.png │ │ │ └── ic_launcher_round.png │ │ │ └── values │ │ │ ├── strings.xml │ │ │ └── styles.xml │ ├── build.gradle │ ├── gradle.properties │ ├── gradle │ │ └── wrapper │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ ├── gradlew │ ├── gradlew.bat │ └── settings.gradle ├── app.json ├── babel.config.js ├── index.js ├── ios │ ├── Podfile │ ├── Podfile.lock │ ├── examples-tvOS │ │ └── Info.plist │ ├── examples-tvOSTests │ │ └── Info.plist │ ├── examples.xcodeproj │ │ ├── project.pbxproj │ │ └── xcshareddata │ │ │ └── xcschemes │ │ │ ├── examples-tvOS.xcscheme │ │ │ └── examples.xcscheme │ ├── examples.xcworkspace │ │ └── contents.xcworkspacedata │ ├── examples │ │ ├── AppDelegate.h │ │ ├── AppDelegate.m │ │ ├── Images.xcassets │ │ │ ├── AppIcon.appiconset │ │ │ │ └── Contents.json │ │ │ └── Contents.json │ │ ├── Info.plist │ │ ├── LaunchScreen.storyboard │ │ └── main.m │ └── examplesTests │ │ ├── Info.plist │ │ └── examplesTests.m ├── metro.config.js ├── package.json └── yarn.lock ├── index.d.ts ├── index.js └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | 6 | # Runtime data 7 | pids 8 | *.pid 9 | *.seed 10 | .DS_Store 11 | 12 | # Directory for instrumented libs generated by jscoverage/JSCover 13 | lib-cov 14 | 15 | # Coverage directory used by tools like istanbul 16 | coverage 17 | 18 | # nyc test coverage 19 | .nyc_output 20 | 21 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 22 | .grunt 23 | 24 | # node-waf configuration 25 | .lock-wscript 26 | 27 | # Compiled binary addons (http://nodejs.org/api/addons.html) 28 | build/Release 29 | 30 | # Dependency directories 31 | node_modules 32 | jspm_packages 33 | 34 | # Optional npm cache directory 35 | .npm 36 | 37 | # Optional REPL history 38 | .node_repl_history 39 | 40 | 41 | .idea 42 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | .idea 2 | Screenshots 3 | .gif 4 | 5 | # OSX 6 | # 7 | .DS_Store 8 | 9 | # Xcode 10 | # 11 | build/ 12 | *.pbxuser 13 | !default.pbxuser 14 | *.mode1v3 15 | !default.mode1v3 16 | *.mode2v3 17 | !default.mode2v3 18 | *.perspectivev3 19 | !default.perspectivev3 20 | xcuserdata 21 | *.xccheckout 22 | *.moved-aside 23 | DerivedData 24 | *.hmap 25 | *.ipa 26 | *.xcuserstate 27 | 28 | # node.js 29 | # 30 | node_modules/ 31 | npm-debug.log 32 | examples/ -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 Jia PengHui 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # react-native-easy-toast 2 | A react native module to show toast like android, it works on iOS and Android. 3 | 4 | [ ![release](https://img.shields.io/github/release/crazycodeboy/react-native-easy-toast.svg?maxAge=2592000?style=flat-square)](https://github.com/crazycodeboy/react-native-easy-toast/releases) 5 | [ ![PRs Welcome](https://img.shields.io/badge/PRs-Welcome-brightgreen.svg)](https://github.com/crazycodeboy/react-native-easy-toast/pulls) 6 | [ ![NPM version](http://img.shields.io/npm/v/react-native-easy-toast.svg?style=flat)](https://www.npmjs.com/package/react-native-easy-toast) 7 | [![License MIT](http://img.shields.io/badge/license-MIT-orange.svg?style=flat)](https://raw.githubusercontent.com/crazycodeboy/react-native-easy-toast/master/LICENSE) 8 | [ ![语言 中文](https://img.shields.io/badge/语言-中文-yellow.svg)](https://github.com/crazycodeboy/react-native-easy-toast/blob/master/README.zh.md) 9 | 10 | ## Content 11 | 12 | - [Installation](#installation) 13 | - [Demo](#demo) 14 | - [Getting started](#getting-started) 15 | - [API](#api) 16 | - [Contribution](#contribution) 17 | 18 | ## Installation 19 | 20 | * 1.Run `npm i react-native-easy-toast --save` 21 | * or `yarn add react-native-easy-toast` 22 | * 2.`import Toast, {DURATION} from 'react-native-easy-toast'` 23 | 24 | ## Demo 25 | * [Examples](https://github.com/crazycodeboy/react-native-easy-toast/tree/master/examples) 26 | 27 | ![Screenshots](https://raw.githubusercontent.com/crazycodeboy/react-native-easy-toast/master/examples/Screenshots/react-native-easy-toast-screenshots.gif) 28 | 29 | ## Getting started 30 | 31 | Add `react-native-easy-toast` to your js file. 32 | 33 | `import Toast, {DURATION} from 'react-native-easy-toast'` 34 | 35 | Inside your component's render method, use Toast: 36 | 37 | ```javascript 38 | render() { 39 | return ( 40 | 41 | ... 42 | this.toast = toast}/> 43 | 44 | ); 45 | } 46 | ``` 47 | 48 | >Note: Be sure to add `Toast` to the bottom of the root view. 49 | 50 | 51 | Then you can use it like this: 52 | 53 | ```javascript 54 | this.toast.show('hello world!'); 55 | ``` 56 | 57 | That's it, you're ready to go! 58 | 59 | show a toast, and execute callback function when toast close it: 60 | 61 | ```javascript 62 | this.toast.show('hello world!', 500, () => { 63 | // something you want to do at close 64 | }); 65 | ``` 66 | 67 | Show a toast forever until you manually close it: 68 | 69 | ```javascript 70 | this.toast.show('hello world!', DURATION.FOREVER); 71 | ``` 72 | 73 | Or pass an element: 74 | 75 | ```javascript 76 | this.toast.show(hello world!); 77 | // later on: 78 | this.toast.close('hello world!'); 79 | ``` 80 | 81 | Optional you can pass a delay in seconds to the close()-method: 82 | 83 | ```javascript 84 | this.toast.close('hello world!', 500); 85 | ``` 86 | 87 | Currently, the default delay for close() in FOREVER-mode is set to 250 ms (or this.props.defaultCloseDelay, which you can pass with) 88 | 89 | ```jsx 90 | 91 | ``` 92 | 93 | 94 | 95 | ### Basic usage 96 | 97 | ```javascript 98 | render() { 99 | return ( 100 | 101 |