expo-hamro-image-picker
Dynamic Image/Files Picker For Expo
![]() |
![]() |
![]() |
![]() |
---|
Installation
To get started install the package in your Expo project by running:
yarn add expo-hamro-image-picker
or
npm i expo-hamro-image-picker
Basic Usage
import React from 'react';
import { View, Button } from 'react-native';
import ExpoHamroImagePicker from 'expo-hamro-image-picker';
export default function Test() {
const [showPicker, setShowPicker] = useState(false);
const handleSubmit = (data) => {
console.log(data)
}
render() {
return (
<View style={{ flex: 1, backgroundColor: '#000000' }}>
<ExpoHamroImagePicker
handlePickerClose={()=>{
console.log("picker closed");
setShowPicker(false);
}}
enablePicker={showPicker}
handleSubmit={handleSubmit}
enableEditor={true}
enableMultiSelect={true}
headerText="New Image"
/>
<Button title="Open Image Picker" onPress={()=>setShowPicker(true)}/>
</View>
)
}
}
Props
Parameter | type | required | default | description |
---|---|---|---|---|
enablePicker | boolean | Yes | open/hide image picker | |
headerText | string | No | New Post | header text shows at top |
enableAlbums | boolean | No | true | allows select albums |
enableCameraCapture | boolean | No | true | allows capture image using camera |
enableMultiSelect | boolean | No | false | allows select multiple image/file |
multiSelectOptions | MultiSelectOptionsProps | No | { minimumImageCount: 1, maximumImageCount: -1 } |
configuration for multi image/file select |
backButtonClose | boolean | No | true | close image picker on back button press |
coverScreen | boolean | No | true | covers entire screen |
swipeToClose | boolean | No | true | swipe down to close |
multipleSelectEnabled | boolean | No | false | multiple image/file select enabled by default when picker opens |
ImageComponent | Component | No | ImageBackground | allows to use different Image Component. i.e. Image/FastImage etc. |
handlePickerClose | function | No | ()=>{console.log("picker closes")} |
triggers when picker closes |
handleSubmit | function | No | (data)=>{console.log("picked image", data)} |
triggers when everything is done |
enableEditor | boolean | No | true | enable editor to allow edit picked image |
editorOptions | ImageEditorProps | No | {fixedCropAspectRatio={16 / 9} lockAspectRatio={false}} |
Image Editor Configurations: https://github.com/thomas-coldwell/expo-image-editor |
Contributing
See the contributing guide to learn how to contribute to the repository and the development workflow.
License
MIT