react-native-select-group-buttons-modal v1.0.0-beta

react-native-select-group-buttons-modal

It's still under development.Please do not try case installation

Getting started

$ npm install react-native-select-group-buttons-modal --save

Mostly automatic installation

$ react-native link react-native-select-group-buttons-modal

Usage

import RNSelectGroupButtonsModal from 'react-native-select-group-buttons-modal';

 <RNSelectGroupButtonsModal
                    settingBuild={this._settingBuild}
                    onPaymentModeChanged={(item, index) => {
                        this.setState({
                            selectText: JSON.stringify(item)
                        })
                    }}
                    data={this.initData()}
                    closeButtonPress={(flag) => {
                        this.setState({
                            selectorVisible: flag
                        })
                    }}
                    selectorVisible={this.state.selectorVisible}/>

Run Sample

npm install expo-cli --global //If you haven't installed it before

git clone git@github.com:ddwhan0123/react-native-select-group-buttons-modal.git //clone git 

cd sample

npm install

expo start -c --localhost --ios

Android Demonstration Effect iOS Demonstration Effect

Properties

settingBuild?:object

Objects that set underlying properties

  _settingBuild = {
        backdropColor: '#303437',
        backdropOpacity: 0.2,
        animationIn: 'slideInUp',
        animationTime: 400,//Default animation duration
        hideOnBack: true,
        modalTitle: '支付方式',//Main title
        modalTips: '业务控制文字内容',Subheading
        closeWithOutSideClick: true,//Click on the grey area to close the bullet window
        submitText: '确定'//Bottom Button submit text
    };

onPaymentModeChanged?:(item, index) => void

Callback of selected content

data?:object[]

Button Data Source Object Array

closeButtonPress?:(flag) => void

Close button callback

selectorVisible?:boolean

Whether to display the bullet window label

defaultMode?:object

Objects selected by default

style

Setting Style Properties

SubmitButtonStyle

Setting the properties of the bottom button style

tipsColor

Setting Subtitle Style

hideCloseButton?:boolean

Set whether to display the close button

defaultCloseIcon?:object

Resource object of close button file

closeWithOutSideClick?:boolean

Click on the outside area to close the bullet window

Licenses

• MIT