Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@ziadalkalza/react-native-color-wheel) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Native Color Wheel

A highly customisable hsv color wheel package for React Native projects.

Features

Can add a custom component inside the main color wheel component
Can convert the selected color to one of six formats (rgb, rgba, hsl, hsla, hsv, hex)
Compatible with Android and IOS

Installation

You need to install react-native-svg to be able to use this package.

Install with CLI:

  npm install @ziadalkalza/react-native-color-wheel

  yarn add @ziadalkalza/react-native-color-wheel

Install with Expo:

  expo install @ziadalkalza/react-native-color-wheel

Screenshot

ColorWheel Screenshot 1

ColorWheel Screenshot 2

Usage

import ColorWheel from "@ziadalkalza/react-native-color-wheel";

function App() {
  return (
    <ColorWheel
      lightnessSlider={{
        enable: true,
        orientation: "horizontal",
        direction: "negative",
        trackWidth: 8,
        xOffset: 30,
        yOffset: 185,
        minValue: 50,
      }}
      hueWheel={{
        size: 170,
      }}
      dimensions={{
        type: "relative",
        height: 220,
      }}
    />
  );
}

Documentation

For component reference, please check the Documentation.

Support

For any enquiries about the package, feel free to contact me through my github, or report an issue.

To report an issue:

Go to issues.
Open an issue with a clear title, description and tag.
Make sure you include:
- A thorough explanation of the issue.
- Steps to reproduce the issue.
- Any error logs.

Contributing

Contributions are always welcome! I am happy to accept any feedback and suggestions for improvements.

Making modifications:

Fork repository
Clone your fork
Make your changes (add branches if needed)

Committing:

Check that your code is running properly on your local machine.
Make sure that the PR is linked to an issue. If no issue exists, please create an issue for it (this ensures there is good communication and all PRs are clear).
Merge PR into the main branch.
PR title should be in the format of prefix:issueNumber/Title

Prefixes:

fix: bug fix
feat: new feature
ref: changes that dont fix issues or add new features
perf: code that improves performance
conf: changes that don't affect the end user
doc: changes to documentation
test: adding/editing tests

License

MIT