Skip to content
This repository has been archived by the owner on Nov 5, 2021. It is now read-only.

hungdev/react-native-media-helper

Repository files navigation

React Native Media Helper

This library has not been maintained for a long time

MediaHelper component for React native, supports both android and ios.

currently, react native camera roll is not supported get thumbnail video from camera roll. So this module support gets thumbnail video and photo. it depends on react-native-thumbnail and react-native-get-real-path library to complete android module

Install

npm install react-native-media-helper --save

then link

react-native-thumbnail

react-native-get-real-path

Usage:

import MediaHelper from 'react-native-media-helper'

  <MediaHelper
    numPhotos={20} // just for android
    numVideos={20} // just for android
    media='All'   // just for ios
    num={20}      // just for ios
    onCancel={() => this.setState({visible: false})}
    onSelectedItem={(item) => alert(JSON.stringify(item))}
  />

Response example:

Ios

{
  "node": {
    "timestamp": 1509173491,
    "location": {},
    "group_name": "Camera Roll",
    "type": "ALAssetTypePhoto",
    "image": {
      "width": 640,
      "height": 640,
      "isStored": true,
      "filename": "cat.jpg",
      "uri": "assets-library://asset/asset.JPG?id=BD2F9143-CAD6-476A-8875-DF91AF6401A5&ext=JPG",
      "playableDuration": 0,
      "thumbnailUrl": "assets-library://asset/asset.JPG?id=BD2F9143-CAD6-476A-8875-DF91AF6401A5&ext=JPG"
    }
  }
}

Android

{
  "node": {
    "timestamp": 1523171768,
    "group_name": "thumb",
    "type": "image/jpeg",
    "image": {
      "height": 320,
      "width": 240,
      "uri": "content://media/external/images/media/2222",
      "thumbnailUrl": "content://media/external/images/media/2222"
    }
  }
}

Props

Property Type default Description
numPhotos PropTypes.number 10 just for Android number of Photo
numVideos PropTypes.number 10 just for Android number of Video
getPhotos PropTypes.bool true just for Android allow get photo
getVideos PropTypes.bool true just for Android allow get video
media PropTypes.string All just for Ios String: All, Photos, Videos
num PropTypes.number 20 just for Ios number item
imageMargin PropTypes.number 5 Margin size of one image.
imagesPerRow PropTypes.number 3 Number of images per row.
headerMid PropTypes.string 'Select Items' Text header mid
headerLeftButton PropTypes.string 'Cancel' Text header left button
headerRightButton PropTypes.string 'Done' Text header right button
onCancel PropTypes.func () => {} Function cancel
onSelectedItem PropTypes.func () => {} Function selected item

About

Supported get thumbnail video from camera roll

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published