Skip to content

A simple react native input component , allows user inputs something from the sheet come from bottom, just like actionSheet

Notifications You must be signed in to change notification settings

booyeu/react-native-input-sheet

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-input-sheet Monthly download Total downloads

Install

npm install react-native-input-sheet --save

Example

example

Usage

import InputSheet, {InputSheetRef} from 'react-native-input-sheet';

const Example = () => {
    const inputSheetRef = useRef<InputSheetRef>(null);

    const showInputSheet = useCallback(() => {
        inputSheetRef.current?.show();
    }, []);
    return (
        <>
            <Button onPress={showInputSheet}>Press me</Button>
            <InputSheet ref={inputSheetRef} onSubmit={console.log} />
        </>
    )
}

Properties

Prop Default Required Description
defaultValue false no the default value of textInput
required true no Whether the text input value is required
placeholder '' no The placeholder of the textInput
onSubmit (text) => {} no Function that is called when user submits it
buttonText 'submit' no The string that is displayed on the submit button
maskStyle - no The style of the masker( )
style - no The style of the container( )
inputStyle - no The style of the textInput( )
buttonTextStyle - no The style of the submit button text( )
autoClearText true no Whether textInput needs be clear after onSubmit finished
inputProps undefined n o The props of textInput
keyboardVerticalOffset 10 2 no The keyboardVerticalOffset of KeyboardAvoidingView

About

A simple react native input component , allows user inputs something from the sheet come from bottom, just like actionSheet

Resources

Stars

Watchers

Forks

Packages

No packages published