1.2.1 • Published 4 years ago
react-native-toast-trung-jin v1.2.1
Toast make by Trung Jin :))
Installation
npm i react-native-toast-trung-jin
Usage
WToast
import {WToast} from 'react-native-toast-trung-jin'
// Base
show = () => {
WToast.show({data: 'hello world'})
}
// Other
show = () => {
const toastOpts = {
data: 'Success',
textColor: '#ffffff',
backgroundColor: '#444444',
duration: WToast.duration.LONG, //1.SHORT 2.LONG
position: WToast.position.TOP, // 1.TOP 2.CENTER 3.BOTTOM
icon: <Image source={require('../data/img/success.png')} style={{width: 32,height: 32,resizeMode: 'contain'}}/>
}
WToast.show(toastOpts)
}
WToast API
Props | Type | Required | Default | Description |
---|---|---|---|---|
data | String | true | ' ' | Displayed content |
duration | Number | false | WToast.duration.SHORT | The duration of the toast |
position | Number | false | WToast.position.BOTTOM | Displayed position |
inEasing | Easing | false | Easing.elastic(1) | Admission animation |
textColor | String | false | 'white' | font color |
backgroundColor | String | false | 'black' | background color |
icon | Component | fasse | undefined | Image to be displayed |
WSnackBar
import {WSnackBar} from 'react-native-toast-trung-jin'
// Base
show = () => {
WSnackBar.show({data: 'hello world'})
}
// Other
show = () => {
const snackBarOpts = {
data: 'Please check the network first.',
position: WSnackBar.position.BOTTOM, // 1.TOP 2.CENTER 3.BOTTOM
duration: WSnackBar.duration.LONG, //1.SHORT 2.LONG 3.INDEFINITE
textColor: '#ff490b',
backgroundColor: '#050405',
actionText: 'Sure',
actionTextColor: '#ff490b',
actionClick: ()=>{
// Click Action
},
}
WSnackBar.show(snackBarOpts)
}
WSnackBar API
Props | Type | Required | Default | Description |
---|---|---|---|---|
data | String | true | ' ' | Displayed content |
statusBarHeight | Number | false | -1 | Prevent Android statusBar |
height | Number | false | 44 | Height to display |
duration | Number | false | WSnackBar.duration.SHORT | The duration of the toast |
position | Number | false | WSnackBar.position.BOTTOM | Displayed position |
inEasing | Easing | false | Easing.linear | Admission animation |
textColor | String | false | 'white' | font color |
backgroundColor | String | false | 'black' | background color |
actionText | String | false | undefined | action text |
actionTextColor | String | false | 'white' | action text color |
actionClick | Function | false | undefined | listener click |
WModal
import {WModal} from 'react-native-toast-trung-jin'
// Base
show = () => {
WModal.show({data: 'hello world'})
}
// Other
show = () => {
const modalOpts = {
data: 'Loading',
textColor: '#fff',
backgroundColor: '#444444',
position: WModal.position.CENTER,
icon: <ActivityIndicator color='#fff' size={'large'}/>
}
WModal.show(modalOpts)
}
WToast API
Props | Type | Required | Default | Description |
---|---|---|---|---|
data | String | true | ' ' | Displayed content |
position | Number | false | WToast.position.BOTTOM | Displayed position |
inEasing | Easing | false | Easing.elastic(1) | Admission animation |
textColor | String | false | 'white' | font color |
backgroundColor | String | false | 'black' | background color |
icon | Component | fasse | undefined | Image to be displayed |
onRequestClose | Function | false | undefined | Android Back |
MIT Licensed
1.2.0
4 years ago
1.1.9
4 years ago
1.2.1
4 years ago
1.1.8
4 years ago
1.1.7
4 years ago
1.1.6
4 years ago
1.1.5
4 years ago
1.1.4
4 years ago
1.1.2
4 years ago
1.1.1
4 years ago
1.1.0
4 years ago
1.0.9
5 years ago
1.0.8
5 years ago
1.0.7
5 years ago
1.0.6
5 years ago
1.0.5
5 years ago
1.0.4
5 years ago
1.0.3
5 years ago
1.0.2
5 years ago
1.0.1
5 years ago
1.0.0
5 years ago