react-native-select-attachment

Supported Versions

react-native-select-attachment	react-native
>= 0.0.1	0.60+

Description

react-native-select-attachment allows the selection of photos, videos, or other files (local or cloud storage like Google Drive, Dropbox, Box). The fileName, fileType, and base64 file data are returned to react-native. This is useful if you want to display or store file data from the device into your application.

Getting Started

$ npm install react-native-select-attachment --save

Android

Not supported in the current release, check back for future releases or create a PR

iOS

CocoaPods on iOS needs this extra step

npx pod-install

To use the react-module, you'll first have to write some privacy descriptions for accessing the photo library and the camera. Open your Info.plist as source and populate the usage descriptions as shown below:

<key>NSMicrophoneUsageDescription</key>
<string>For people to hear you during meetings, we need access to your microphone.</string>
<key>NSCameraUsageDescription</key>
<string>This app wants to take pictures.</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app wants to use your photos.</string>

Usage

To import into your react app, import the SelectAttachmentButton component.

import SelectAttachment from 'react-native-select-attachment';

And call showPicker as shown below:

var options = {
    maxFileSize: 10,
    fileTypes: ['png', 'jpg', 'pdf'],
    disableCameraPhotos: false,
    disableCameraVideos: false,
    disablePhotos: false,
    disableVideos: false,
    disableFiles: false,
    cameraLabel: 'Camera',
    albumLabel: 'Album',
    filesLabel: 'Files',
    enableImageScaling : true,
    imageScale : 0.90,
    maxImageWidth : 950
};

SelectAttachment.showPicker(options, (res) => {
    if(res.error){
        console.error(res.error);
    } else {
        console.error(res.fileName);
        console.error(res.fileType);
        console.error(res.base64);
    }
});

Reference

Options

maxFileSize

The max file size allowed of the selected file (in MB)

Type	Required	Default
[String]	No	null

---

fileTypes

The file types that will be allowed for selection (in Files). If left blank all file types are allowed for selection

Supported options are:

• png
• pdf
• jpg
• csv

Type	Required	Default
[String]	No	['all']

---

disablePhotos

Disables the Camera from the popup options

Type	Required	Default
Boolean	No	false

---

disableFiles

Disables the Files from the popup options

Type	Required	Default
Boolean	No	false

---

cameraLabel

Overrides the label for Camera popup

Type	Required	Default
String	No	'Camera'

---

albumLabel

Overrides the label for Album popup

Type	Required	Default
String	No	'Album'

---

filesLabel

Overrides the label for Files popup

Type	Required	Default
String	No	'Files'

---

enableImageScaling

Allows scaling images to reduce file size.

Type	Required	Default
Boolean	No	false

---

imageScale

If enableImageScaling is true, the image resolution is reduced by a percentage entered. Example 0.5 would reduce the resolution by 50%

Type	Required	Default
Decimal	No	1.0

---

maxImageWidth

The max width of the image in pixels. Images will be scaled to the entered value. This is useful to reduce file size.

Type	Required	Default
Integer	No	950

---