pradeep1991singh/react-native-image-color-picker

Image color picker based on image source provided and return image different color palettes or average color palette

react-native-image-color-picker

Image color picker: Provide image source and it will return

• Different color palettes out of image
• Average color palette out of image

Getting started

$ npm install react-native-image-color-picker --save

or

$ yarn add react-native-image-color-picker --save

and

$ react-native link image-color-picker #(for android)

Usage

import React, { Component } from 'react';
import { ImageColorPicker } from 'react-native-image-color-picker';

export default class App extends Component {

  pickerCallback = message => {
    if (message && message.nativeEvent && message.nativeEvent.data) {
      console.log(message.nativeEvent.data); // response from ImageColorPicker
    }
  };

  render() {
    return (
        ....

        <ImageColorPicker
          imageUrl="https://dummyimage.com/100x100"
          pickerCallback={this.pickerCallback}
        />

        ....
    );
  }
}

Available Props/Options

• imageUrl: url of image
• pickerCallback: callback method for ImageColorPicker Success or Failure
• (optional)imageType: type of image e.g. jpeg, png Default value: jpeg
• (optional)paletteType: palette type e.g average: for average color of image, dominant: dominant colors in image Default value: dominant
• (optional)paletteCount: no of color palettes need e.g. 3 dominant color palette, applicable only in case of paletteType: 'dominant' Default value: 3
• (optional)defaultPalette: default color palette Default value: [0, 0, 0, 1]
• (optional)colorType: color code type e.g. rgba or hex Default value: rgba
• (optional)pickerStyle: picker container styles
• (optional)imageWidth: custom image width, other than natural
• (optional)imageHeight: custom image height, other than natural

Example App

Example App

Demo

Demo

TODO

• Support Image picker gallery

Contributing

Interested in contributing to this repository? PR are most welcome!

---