1.0.1 • Published 7 years ago

react-native-modalpopup v1.0.1

Weekly downloads
3
License
ISC
Repository
github
Last release
7 years ago

react-native-modalpopup

A react-native Modal / Popup component for Android & iOS.

Donate

It helps to me. I will appreciated for that Donate

Features

  • Pure JS.
  • Customizable.
  • Compatible with Android & iOS.
  • Configurated.
  • Ready to the usage.

Demo

Installation

npm i react-native-modalpopup --save

Usage

Basic

Import module:

import { ModalPopup } from 'react-native-modalpopup';

Using

<ModalPopup
    title='Hello world'
    isVisible={this.state.visible}
    onTouchOutside={() => {this.setState({visible:false})}}
>
    //... some childs
</ModalPopup>

Customization

Give the style props as your choice:

  • titleStyle: Change style of title if u want, see Text style props in react native documentation for more
  • outsideBgColor: Change the background outside color, default is grey.
  • modalBgColor: Change the Modal / Popup color, default is white.
  • modalBorderRadius: Set number to put border radius to Modal / Popup.
  • modalPadding: Boolean, active the padding for Modal / Popup. If you put ur own styles, it will active.

API

Props

PropTypeOptionalDefaultDescription
titlestringYes-Add title to Modal / Popup
titleStyleobjectYes{{textAlign:'center',color:'#757575', fontSize:18, margin:16, marginBottom: 10}Styles for the Title, see Text style props in react native documentation for more.
onTouchOutsidefunctionNO - Required-Do you want to do when you'll click outside space.
isVisiblebooleanNO - RequiredfalseShow and hide Modal / Popup

Next version

Any suggestion is welcome.

Donate

It helps to me. I will appreciated for that Donate