1.0.15 • Published 4 years ago

@sergeymell/nativescript-color-wheel v1.0.15

Weekly downloads
1
License
Apache-2.0
Repository
github
Last release
4 years ago

NativeScript Color Wheel

NativeScript 6 version of this plugin is available at https://github.com/SergeyMell/nativescript-n6-color-wheel

Description

This plugin is actually a color picker plugin which can be used as a simple component wherever you need it. It allows you to

  • pick a color by clicking appropriate position on the color wheel
  • render whatever UI as a picker icon customizing it on your own needs
  • set an initial color for the plugin
  • put the color picker wherever you need it as long it's just a custom element.

Plugin works simultaneously for both iOS and Android platforms and is not based on any additional libraries, CocoaPods etc

Examples

Color wheel with custom selection pickerColor picker in a modal dialog

Installation

ns plugin add @sergeymell/nativescript-color-wheel

Usage

In NativeScript Core applications:

<clw:ColorWheel width="200" height="200" color="#FFB35E"
                            colorSelect="{{colorSelected}}"/>

In NativeScript Angular applications:

  1. Add NativeScriptColorWheelModule from @sergeymell/nativescript-color-wheel/angular to the imports section of your Angular module
  2. Use the ColorWheel component where you need it
<ColorWheel width="200" height="200" margin="20" (colorSelect)="onColorSelected($event)"></ColorWheel>

TODOs:

  • optimize the algorithm of initial color location determination
  • make color brightness configurable (at least for Android)
  • add support of other color selection area forms (i.e. square)

License

Apache License Version 2.0