Color wheel для андроид

ColorWheel is a library for Android which contains helpful views which can be used to pick an ARGB color.

From version 1.1.13 the library will be hosted on Maven Central Repository because JCenter announced its deprecation in the future. This migration lead to change of the group id which is now com.github.antonpopoff .

The minimal required Android version is 16 (Android 4.1).

In case of any problems make sure that jCenter or Maven Central repositories are specified in your build.gradle file:

For version 1.1.13 and above:

For version 1.1.12 and below:

To set/get a RGB color you can use ColorWheel.rgb property:

You can set a listener via ColorWheel.colorChangeListener property:

Important note: keep in mind that ColorWheel is a two-dimensional implementation of HSV color model. Two-dimensional in that case means that its brightness (value) component of HSV is always set to 1 . Because of that, ColorWheel can’t display every single color supported by HSV.

Therefore if you set a color which can’t be displayed it will be transformed to the closest HSV color which can be displayed by ColorWheel . In order to pick colors which can’t be displayed by ColorWheel you can additionally use GradientSeekBar .

GradientSeekBar view draws a vertical or horizontal bar filled with a linear gradient of two colors. You can use the view to pick an intermediate color in-between.

To pick an intermediate ARGB color you can use GradientSeekBar.argb property:

To set/get start/end colors you can use the following properties and methods:

If you want to change an intermediate color programmatically you can use GradientSeekBar.offset property. Its value lies within the range from 0f to 1f and reflects how close the intermediate color to startColor or endColor properties.

You can set a listener via GradientSeekBar.colorChangeListener property:

It’s impossible to pick all different colors from ColorWheel because it’s only two-dimensional and the brightness (value) component of HSV is always set to 1 .

To compensate that you can use GradientSeekBar and its setBlackToColor(color) extension. This method sets black color as startColor and supplied color as endColor . This gives you a possibility to pick additional shades of a color picked from ColorWheel .

If you want to use GradientSeekBar to pick the alpha value of a color in range from 0 to 255 you can use the following extension:

GradientSeekBar.setTransparentToColor(color: Int, respectAlpha: Boolean = true)

This method takes an ARGB color and sets the transparent version of it as startColor and an opaque version as endColor . respectAlpha parameter determines whether or not the thumb’s position will be adjusted based on the alpha value of the color you supplied.

To get the alpha value of the current color you can use GradientSeekBar.currentColorAlpha extension property.

You can use GradientSeekBar.setAlphaChangeListener extenstion to set a listener that has additional alpha parameter which lies withing the range from 0 to 255 .

You can use the following XML attributes to additionally customize ColorWheel and GradientSeekBar .

XML Attribute	Property	Description
tb_thumbRadius	thumbRadius	Sets ColorWheel ‘s thumb radius
tb_thumbColor	thumbColor	Sets ColorWheel ‘s thumb color
tb_thumbStrokeColor	thumbStrokeColor	Sets ColorWheel ‘s thumb stroke color
tb_thumbColorCirlceScale	thumbColorCircleScale	Sets ColorWheel ‘s thumb color circle size which is relative to thumbRadius . This value is in range from 0 to 1 . If it set to 1 it will have the same size as thumbRadius

For version 1.1.13 and above:

XML Attribute	Property	Description
tb_thumbRadius	thumbRadius	Sets GradientSeekBar ‘s thumb radius
tb_thumbColor	thumbColor	Sets GradientSeekBar ‘s thumb color
tb_thumbStrokeColor	thumbStrokeColor	Sets GradientSeekBar ‘s thumb stroke color
tb_thumbColorCirlceScale	thumbColorCircleScale	Sets GradientSeekBar ‘s thumb color circle size which is relative to thumbRadius . This value is in range from 0 to 1 . If it set to 1 it will have the same size as thumbRadius
gsb_barSize	barSize	Sets width(vertical)/height(horizontal) of GradientSeekBar ‘s gradient bar depending on it’s orientation
gsb_barCornersRadius	cornerRadius	Sets GradientSeekBar ‘s gradient bar corners radius
gsb_startColor	startColor	Sets GradientSeekBar ‘s startColor
gsb_endColor	endColor	Sets GradientSeekBar ‘s endColor
gsb_offset	offset	Sets GradientSeekBar ‘s offset
gsb_orientation	orientation	Sets GradientSeekBar ‘s orientation. Possible values: vertical / horizontal

For version 1.1.12 and below:

Источник