react-native-dialog-input-custom
This is a dialog input for react native, it's really customizable. It works fine in Android and iOS.
Setup
npm install --save react-native-dialog-input
Basic Usage
;;; <> { superprops; thisstate = dialogIsVisible: true } { return <View style=stylescontainer> <DialogInput dialogIsVisible=thisstatedialogIsVisible closeDialogInput= this submitInput= console /> </View> ; } const styles = StyleSheet;
Example (Basic)
Custom Usage
;;; <> { superprops; thisstate = dialogIsVisible: true } { return <View style=stylescontainer> <DialogInput dialogIsVisible=thisstatedialogIsVisible closeDialogInput= this submitInput= console outerContainerStyle= backgroundColor: 'rgba(0,0,0, 0.75)' containerStyle= backgroundColor: 'rgba(255,0,0, 0.2)' borderColor: 'red' borderWidth: 5 titleStyle= color: 'white' title="This is the title" subTitleStyle= color: 'white' subtitle="This is the subtitle" placeholderInput="This is the text inside placeholder..." placeholderTextColor="black" textInputStyle= borderColor: 'black' borderWidth: 2 secureTextEntry=false buttonsStyle= borderColor: 'white' textCancelStyle= color: 'white' submitTextStyle= color: 'white' fontStyle: 'italic' cancelButtonText="CANCEL" submitButtonText="CONFIRM" /> </View> ; } const styles = StyleSheet;
Example (Custom)
Properties
name | description | type |
---|---|---|
dialogIsVisible | Value to show the dialog | Boolean |
outerContainerStyle | Style for the background of the component | Object (OPTIONAL) |
containerStyle | Style for the container of the component | Object (OPTIONAL) |
titleStyle | Style for the title | Object (OPTIONAL) |
title | Value of the title | String (OPTIONAL) |
subTitleStyle | Value of the subtitle | String (OPTIONAL) |
placeholderInput | Value of the placeholder | String (OPTIONAL) |
placeholderTextColor | Color of the placeholder | String (OPTIONAL) |
textInputStyle | Style for the TextInput component | Object (OPTIONAL) |
secureTextEntry | Value for the secure text property | Boolean (OPTIONAL), default FALSE |
buttonsStyle | Style for the two buttons | Object (OPTIONAL) |
textCancelStyle | Style for the "Cancel" Button | Object (OPTIONAL) |
submitTextStyle | Style for the "Submit" Button | Object (OPTIONAL) |
cancelButtonText | Value of the "Cancel" Button | String (OPTIONAL) |
submitButtonText | Value of the "Submit" Button | String (OPTIONAL) |
Methods
name | description | returns |
---|---|---|
closeDialogInput() | Event fired when the user press the Cancel Button and Submit Button, used to close the dialog | - |
submitInput() | Event fired when the user press the Submit button, it will also invoke closeDialogInput(), and returns the value of the text input | String |