https://github.com/guillaumemorin/react-native-cloudinary-image-display

React Native Cloudinary Image Display
https://github.com/guillaumemorin/react-native-cloudinary-image-display

cloudinary display image react-native

Last synced: about 1 month ago
JSON representation

React Native Cloudinary Image Display

• Host: GitHub
• URL: https://github.com/guillaumemorin/react-native-cloudinary-image-display
• Owner: guillaumemorin
• Created: 2018-05-04T08:40:18.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2022-02-08T23:05:15.000Z (almost 3 years ago)
• Last Synced: 2024-10-28T14:44:45.248Z (about 2 months ago)
• Topics: cloudinary, display, image, react-native
• Language: JavaScript
• Size: 2.92 MB
• Stars: 6
• Watchers: 4
• Forks: 3
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


	React Native Cloudinary Image Display





	

     





	


		react-native-cloudinary-image-display can be used to properly display Image from cloudinary according to device dimensions.

	

	



## Installation

```

npm i --save react-native-cloudinary-image-display

```

## Props

In order to properly use this library you have to provide it with a few configuration parameters:

### Required:

#### `cloud_name`

The cloudinary cloud name associated with your Cloudinary account.

#### `imageId`

Id of the uploaded image.

#### `width`

Original width of the uploaded image.

#### `height`

Height of the uploaded image.

### Optional:

#### `options`

In addition to the mandatory cloud_name identifier, there are also a number of optional parameters you may want to define.

Please refer to [Cloudinary Documentation](https://cloudinary.com/documentation/solution_overview#configuration_parameters) for more information on these parameters.

if no options object is set, following default options will be used:

```

{

	crop: 'fill',

	format: 'jpg',

	quality: 100,

	secure: true,

	cdn_subdomain: true

}

```

#### `style`

Custom style to apply to Image.

#### `borderRadius`

Border radius to apply to Image

#### `sideMargin`

Side margin to apply to Image

## Usage

```

import CloudinaryImage from 'react-native-cloudinary-image-display';

```