How To Add Highlights On Instagram From Camera Roll

@react-native-community/cameraroll

Getting started

$ npm install @react-native-community/cameraroll --salvage

More often than not automatic installation

$ react-native link @react-native-customs/cameraroll && npx pod-install

Manual installation

iOS

1. In XCode, in the project navigator, right click Libraries ➜ Add Files to [your projection's name]
2. Get to node_modules ➜ @react-native-community/cameraroll and add RNCCameraroll.xcodeproj
3. In XCode, in the project navigator, select your project. Add libRNCCameraroll.a to your project's Build Phases ➜ Link Binary With Libraries
4. Run your project (Cmd+R)<

Android

1. Open up android/app/src/main/java/[...]/MainApplication.java

• Add import com.reactnativecommunity.cameraroll.CameraRollPackage; to the imports at the top of the file
• Add new CameraRollPackage() to the listing returned past the getPackages() method

2. Append the following lines to android/settings.gradle:

                     include ':@react-native-community_cameraroll' projection(':@react-native-community_cameraroll').projectDir = new File(rootProject.projectDir, 	'../node_modules/@react-native-customs/cameraroll/android')                                  

3. Insert the post-obit lines within the dependencies block in android/app/build.gradle:

                                         compile project(':@react-native-community_cameraroll')                                  

Starting with Android ten, the concept of scoped storage is introduced. Currently, to make it working with that alter, yous have to add android:requestLegacyExternalStorage="true" to AndroidManifest.xml:

<manifest              ... >   <application              android              :              requestLegacyExternalStorage=                "truthful"                            ... >     ...   </application> </manifest>

Migrating from the core react-native module

This module was created when the CameraRoll was split out from the core of React Native. To drift to this module you demand to follow the installation instructions above and then change you imports from:

              import              {              CameraRoll              }              from              "react-native"              ;            

to:

              import              CameraRoll              from              "@react-native-customs/cameraroll"              ;            

Usage

CameraRoll provides access to the local camera ringlet or photograph library.

Permissions

iOS

The user'south permission is required in guild to admission the Camera Roll on devices running iOS 10 or subsequently. Add together the NSPhotoLibraryUsageDescription central in your Info.plist with a string that describes how your app will use this information. This fundamental will appear as Privacy - Photograph Library Usage Clarification in Xcode.

If you are targeting devices running iOS 11 or later, you will also demand to add the NSPhotoLibraryAddUsageDescription key in your Info.plist. Apply this primal to define a string that describes how your app will use this data. Past adding this key to your Info.plist, y'all will be able to request write-only access permission from the user. If yous attempt to save to the camera ringlet without this permission, your app will exit.

Android

Permission is required to read and write to the external storage.

On Expo, follow the guide here for requesting the permission.

On react-native-cli or ejected apps, adding the following lines will add together the capability for the app to request the permission. Find more info on Android Permissions here.

<manifest> ... <uses-permission              android              :              name=                "android.permission.READ_EXTERNAL_STORAGE"              /> <uses-permission              android              :              proper name=                "android.permission.WRITE_EXTERNAL_STORAGE"              /> ... <application>

Then you have to explicitly enquire for the permission

              import              {              PermissionsAndroid              ,              Platform              }              from              "react-native"              ;              import              CameraRoll              from              "@react-native-community/cameraroll"              ;              async              function              hasAndroidPermission              (              )              {              const              permission              =              PermissionsAndroid              .              PERMISSIONS              .              WRITE_EXTERNAL_STORAGE              ;              const              hasPermission              =              await              PermissionsAndroid              .              check              (              permission              )              ;              if              (              hasPermission              )              {              return              true              ;              }              const              status              =              await              PermissionsAndroid              .              request              (              permission              )              ;              return              status              ===              'granted'              ;              }              async              function              savePicture              (              )              {              if              (              Platform              .              OS              ===              "android"              &&              !              (              wait              hasAndroidPermission              (              )              )              )              {              render              ;              }              CameraRoll              .              save              (              tag              ,              {              type,              anthology              }              )              }              ;            

Methods

• save
• getAlbums
• getPhotos
• deletePhotos

---

Reference

Methods

save()

              CameraRoll              .              save              (              tag              ,              {              type,              album              }              )            

Saves the photo or video to the photograph library.

On Android, the tag must be a local prototype or video URI, such as "file:///sdcard/img.png".

On iOS, the tag can be any epitome URI (including local, remote asset-library and base64 data URIs) or a local video file URI (remote or data URIs are non supported for saving video at this time).

If the tag has a file extension of .mov or .mp4, it will be inferred as a video. Otherwise it will exist treated equally a photograph. To override the automatic choice, you can pass an optional type parameter that must exist 1 of 'photograph' or 'video'.

It allows to specify a particular album you want to store the nugget to when the param album is provided. On Android, if no album is provided, DCIM directory is used, otherwise Pic or MOVIES directory is used depending on the type provided.

Returns a Promise which will resolve with the new URI.

Parameters:

Name	Type	Required	Description
tag	string	Yeah	Meet to a higher place.
type	enum('photo', 'video')	No	Overrides automatic detection based on the file extension.
album	string	No	The album to save to

---

getAlbums()

              CameraRoll              .              getAlbums              (              params              )              ;            

Returns a Hope with a listing of albums

Parameters:

• assetType : {string} : Specifies filter on nugget blazon. Valid values are:
  • All // default
  • Videos
  • Photos

Returns:

Assortment of Album object

• title: {string}
• count: {number}

---

getPhotos()

              CameraRoll              .              getPhotos              (              params              )              ;            

Returns a Promise with photograph identifier objects from the local camera ringlet of the device matching shape defined by getPhotosReturnChecker.

Parameters:

Name	Type	Required	Description
params	object	Aye	Expects a params with the shape described below.

• first : {number} : The number of photos wanted in reverse order of the photograph application (i.due east. most recent first for SavedPhotos). Required.
• later : {string} : A cursor that matches page_info { end_cursor } returned from a previous phone call to getPhotos. Note that using this will reduce functioning slightly on iOS. An alternative is just using the fromTime and toTime filters, which have no such touch on.
• groupTypes : {string} : Specifies which group types to filter the results to. Valid values are:
  • Album
  • All // default
  • Consequence
  • Faces
  • Library
  • PhotoStream
  • SavedPhotos
• groupName : {string} : Specifies filter on group names, similar 'Recent Photos' or custom album titles.
• assetType : {string} : Specifies filter on asset type. Valid values are:
  • All
  • Videos
  • Photos // default
• mimeTypes : {Array} : Filter past mimetype (e.one thousand. paradigm/jpeg). Note that using this will reduce operation slightly on iOS.
• fromTime : {number} : Filter by cosmos fourth dimension with a timestamp in milliseconds. This time is sectional, so we'll select all photos with timestamp > fromTime.
• toTime : {number} : Filter by creation time with a timestamp in milliseconds. This fourth dimension is inclusive, so we'll select all photos with timestamp <= toTime.
• include : {Array} : Whether to include some fields that are slower to fetch
  • filename : Ensures prototype.filename is available in each node. This has a large performance impact on iOS.
  • fileSize : Ensures image.fileSize is available in each node. This has a large performance impact on iOS.
  • location: Ensures location is available in each node. This has a large performance impact on Android.
  • imageSize : Ensures image.width and prototype.tiptop are available in each node. This has a pocket-sized performance bear upon on Android.
  • playableDuration : Ensures image.playableDuration is available in each node. This has a medium peformance touch on Android.

Returns a Promise which when resolved will be of the following shape:

• edges : {Array} An array of node objects
  • node: {object} An object with the following shape:
    • type: {string}
    • group_name: {string}
    • prototype: {object} : An object with the following shape:
      • uri: {string}
      • filename: {string | null} : Simply set if the include parameter contains filename
      • height: {number | zilch} : But set if the include parameter contains imageSize
      • width: {number | cypher} : Only set if the include parameter contains imageSize
      • fileSize: {number | naught} : Simply set if the include parameter contains fileSize
      • playableDuration: {number | goose egg} : Simply set for videos if the include parameter contains playableDuration. Will be null for images.
    • timestamp: {number}
    • location: {object | nil} : Only set if the include parameter contains location. An object with the following shape:
      • latitude: {number}
      • longitude: {number}
      • altitude: {number}
      • heading: {number}
      • speed: {number}
• page_info : {object} : An object with the following shape:
  • has_next_page: {boolean}
  • start_cursor: {string}
  • end_cursor: {string}
• limited : {boolean | undefined} : true if the app can only access a subset of the gallery pictures (authorization is PHAuthorizationStatusLimited), imitation otherwise (iOS but)

Example

Loading images:

              _handleButtonPress              =              (              )              =>              {              CameraRoll              .              getPhotos              (              {              get-go:              20              ,              assetType:              'Photos'              ,              }              )              .              then              (              r              =>              {              this              .              setState              (              {              photos:              r              .              edges              }              )              ;              }              )              .              take hold of              (              (              err              )              =>              {              //Fault Loading Images              }              )              ;              }              ;              render              (              )                            {              render              (              <              View              >              <              Button              title              =              "Load Images"              onPress              =              {              this              .              _handleButtonPress              }              /              >              <              ScrollView              >              {              this              .              state              .              photos              .              map              (              (              p              ,              i              )              =>              {              return              (              <              Prototype              primal              =              {              i              }              mode              =              {              {              width:              300              ,              height:              100              ,              }              }              source              =              {              {              uri:              p              .              node              .              paradigm              .              uri              }              }              /              >              )              ;              }              )              }              <              /              ScrollView              >              <              /              View              >              )              ;              }            

---

deletePhotos()

              CameraRoll              .              deletePhotos              (              [              uri              ]              )              ;            

Requests deletion of photos in the camera roll.

On Android, the uri must exist a local image or video URI, such as "file:///sdcard/img.png".

On iOS, the uri tin exist any image URI (including local, remote asset-library and base64 data URIs) or a local video file URI. The user is presented with a dialog box that shows them the nugget(s) and asks them to confirm deletion. This is not able to exist bypassed as per Apple Developer guidelines.

Returns a Promise which will resolve when the deletion request is completed, or reject if there is a problem during the deletion. On iOS the user is able to cancel the deletion request, which causes a rejection, while on Android the rejection will be due to a arrangement mistake.

Parameters:

Name	Type	Required	Clarification
uri	string	Aye	Encounter in a higher place.

Source: https://github.com/react-native-cameraroll/react-native-cameraroll

Posted by: whitemintough.blogspot.com

Share this post