A colorful SeekBar for picking color

Overview

ColorSeekbar

ScreenShot:

Attrs

attr format default
colorSeeds references
colorBarPosition integer 0
alphaBarPosition integer 0
maxPosition integer 100
bgColor color TRANSPARENT
barHeight dimension 2dp
barMargin dimension 5dp
thumbHeight dimension 30dp
showAlphaBar boolean false
showColorBar boolean true
isVertical boolean false
disabledColor color Color.GRAY
showThumb boolean true
barRadius dimension 0px

Gradle:

Release API Android Arsenal

Step 1. Add the JitPack repository in your root build.gradle at the end of repositories:

allprojects {
    repositories {
        ...
        maven { url "https://jitpack.io" }
    }
}

Step 2. Add the dependency

implementation 'com.github.rtugeek:colorseekbar:1.7.7'

Usage

XML

<com.rtugeek.android.colorseekbar.ColorSeekBar
  android:id="@+id/colorSlider"
  android:layout_width="match_parent"
  app:colorSeeds="@array/material_colors"
  android:layout_height="wrap_content" />

JAVA

colorSeekBar.setMaxPosition(100);
colorSeekBar.setColorSeeds(R.array.material_colors); // material_colors is defalut included in res/color,just use it.
colorSeekBar.setColorBarPosition(10); //0 - maxValue
colorSeekBar.setAlphaBarPosition(10); //0 - 255
colorSeekBar.setPosition(10,10); // An easier way to set ColorBar and AlphaBar

colorSeekBar.setShowAlphaBar(true);
colorSeekBar.setBarHeight(5); //5dpi
colorSeekBar.setThumbHeight(30); //30dpi
colorSeekBar.setBarMargin(10); //set the margin between colorBar and alphaBar 10dpi

Listener

colorSeekBar.setOnColorChangeListener(new ColorSeekBar.OnColorChangeListener() {
        @Override
        public void onColorChangeListener(int colorBarPosition, int alphaBarPosition, int color) {
            textView.setTextColor(color);
            //colorSeekBar.getAlphaValue();
        }
});

Vertical Bar

<com.rtugeek.android.colorseekbar.ColorSeekBar
  android:id="@+id/colorSlider"
  android:layout_width="match_parent"
  app:colorSeeds="@array/material_colors"
  app:isVertical="true"
  android:layout_height="wrap_content" />

getColor() issue

Render flow:
1.Activity->onCreate();
2.Activity->onResume();
3.ColorSeekBar->onMeasure();
4.ColorSeekBar->onSizeChanged();
5.ColorSeekBar->init();
6.ColorSeekBar->onMeasure();
7.ColorSeekBar->onDraw();

getColor()/getColors()/getColorIndexPosition() do not work correct until onDraw() method invoked. So, If you want to get color or something else form ColorSeekBar on Activity.onCreate() function, just do:

mColorSeekBar.setOnInitDoneListener(new ColorSeekBar.OnInitDoneListener() {
    @Override` `
    public void done() {
        mColorSeekBar.getColorIndexPosition(mColor);
        //mColorSeekBar.getColors();
        //mColorSeekBar.getColor();
    }
});

Spread the word

License

        DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
                Version 2, December 2004

Copyright (C) 2004 Leon Fu <[email protected]>

Everyone is permitted to copy and distribute verbatim or modified
copies of this license document, and changing it is allowed as long
as the name is changed.

        DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION

 0. You just DO WHAT THE FUCK YOU WANT TO.
Comments
  • setColorSeeds(int[] colors) not working?

    setColorSeeds(int[] colors) not working?

    In version 1.0.2 i used to set seekbar color by setColors(int[] colors), but in version 1.4.3 setColorSeeds() not working anymore.. It change just thumb color of seek bar. Any reason for that?

    bug 
    opened by DarioNevistic 7
  • Logo design proposal

    Logo design proposal

    Greetings @rtugeek Sir, I am a graphic designer and an open source contributor. I would like to contribute to your good project by designing a logo for it which will add more visibility and interest from the users. I will be doing it for free as my gift to your project. If you permit me i will start immediately and show you my output here. Thanks and best regards!

    -Tobaloidee

    opened by Tobaloidee 5
  • AlphaBar minimum position

    AlphaBar minimum position

    Hi, this is awesome library for color seekbar. i am using library in my project. every thing is working awesome but i am stuck on a point. the point is can we set alpha bar minimum position. i don't want to allow user to set alpha bar position below 70. Is there any way to set alphabar minimum thumb position to 70.

    Thanks in advance

    enhancement 
    opened by vikasWri 5
  • width and height must be > 0

    width and height must be > 0

    relevant xml:

                    <com.rtugeek.android.colorseekbar.ColorSeekBar
                        android:id="@+id/colorSlider"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        app:colors="@array/material_colors"
                        />
    

    java.lang.IllegalArgumentException: width and height must be > 0 at android.graphics.Bitmap.createBitmap(Bitmap.java:830) at android.graphics.Bitmap.createBitmap(Bitmap.java:809) at android.graphics.Bitmap.createBitmap(Bitmap.java:776) at com.rtugeek.android.colorseekbar.ColorSeekBar.onSizeChanged(ColorSeekBar.java:174) at android.view.View.sizeChange(View.java:16757) at android.view.View.setFrame(View.java:16719) at android.view.View.layout(View.java:16636) at android.widget.RelativeLayout.onLayout(RelativeLayout.java:1079)

    bug 
    opened by shineangelic 5
  • getColorIndexPosition always returns -1

    getColorIndexPosition always returns -1

    Set up ColorSeekBar like so.

    private void setUpColorPicker() {
            colorSlider.setMaxPosition(100);
            colorSlider.setColorSeeds(R.array.material_colors);
            colorSlider.setColorBarPosition(0);
            colorSlider.setBarHeight(5);
            colorSlider.setThumbHeight(30);
            this.color = colorSlider.getColor();
    
            colorSlider.setOnColorChangeListener(new ColorSeekBar.OnColorChangeListener() {
                @Override
                public void onColorChangeListener(int colorBarPosition, int alphaBarPosition, int color) {
                    CourseManageFragment.this.color = color;
                }
            });
        }
    

    // Starts another activity then returns. // Call the following methods

    // Where color is a valid color from above ColorSeekBar
    int pos = colorSlider.getColorIndexPosition(course.getColor()); // Always returns -1
    colorSlider.setColorBarPosition(pos);
    
    opened by jlurena 3
  • colorBarPosition doesn't work since v1.1.2

    colorBarPosition doesn't work since v1.1.2

    Hey. I've been using the library since the v.1.0.2 update. My XML was looking like this one, and it was working as expected:

    <com.rtugeek.android.colorseekbar.ColorSeekBar
            android:id="@+id/colorSeekbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="8dp"
            app:color="@array/wheel_colors_7"
            app:maxValue="6"
            app:barHeight="8dp"
            app:colorBarValue="3"/>
    

    However, after updating to the v1.1.2, I changed the XML to works with the latest changes:

    <com.rtugeek.android.colorseekbar.ColorSeekBar
            android:id="@+id/colorSeekbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="8dp"
            app:colorSeeds="@array/wheel_colors_7"
            app:maxPosition="6"
            app:barHeight="8dp"
            app:colorBarPosition="3"/>
    

    Then I see that app:colorBarPosition is not working properly, showing "0" as the initial position when a ColorSeekBar is displayed.

    bug 
    opened by javiersantos 2
  • Set thumb at particular color

    Set thumb at particular color

    I have a color (rgb) and I need to set the thumb at that color?

    I have tried to loop over until I find the thumb at that color, like:

    mRgbSeekbar.setMaxValue(100);
     private void findSeekBarRgb(int rgb) {
                int current = 0;
                while(current <= 100){
                    mRgbSeekBar.setColorBarValue(current);
                    int color = mRgbSeekBar.getColor();
                    if(rgb == color) return;
                    current++;
                }
            }
    

    Is there any convenient method?

    enhancement 
    opened by NikolaDespotoski 2
  • Enable\Disable ColorSeekBar

    Enable\Disable ColorSeekBar

    I want to disable the colorseekbar when there is some method calls and enable after that work done how can i prevent user to seek colorseekbar?

    i tried the setEnabled(boolean enable); but it not works in colorseekbar.

    bug 
    opened by RB4915 1
  • How I can set the thumb to desired position without moving?

    How I can set the thumb to desired position without moving?

    We are using this for ruler purpose and need to show thumb on desired position. For example, I have set minimum value 300 and maximum value 800. Based on some calculation I get some random number between 300-800. So I want to set this value on seekbar.

    opened by neharaut 1
  • Why isn't there a getAlphaBarPosition method ?

    Why isn't there a getAlphaBarPosition method ?

    I need to get the position of the alpha bar and there isn't a method similar to getColorPosition() for the alpha bar. Thanks by the way for this great library :)

    enhancement 
    opened by goldenordem 1
  • Won't link...

    Won't link... "failed to resolve 'com.rtugeek.android:colorseekbar:1.0.0'"

    Realizing this is a new repo/release...

    I just ran across this control, which was exactly what I'm looking for (a very low-profile slider for picking colors I can use in a list). I'm just getting my feet wet with Android, so maybe I'm missing something, but it looks like you are referencing release '1.0.0' in the gradle dependencies, but jitpack.io requires that be an existing release in your github repo... There isn't a release 1.0.0 yet. I tried the "short hash" that jitpack mentions as well, but couldn't get that to work either (I probably am misunderstanding what that is)...

    Here is the gradle output.

    Error:A problem occurred configuring project ':app'.

    Could not resolve all dependencies for configuration ':app:_debugCompile'. Could not find com.rtugeek.android:colorseekbar:1.0.0. Searched in the following locations: https://jitpack.io/com/rtugeek/android/colorseekbar/1.0.0/colorseekbar-1.0.0.pom https://jitpack.io/com/rtugeek/android/colorseekbar/1.0.0/colorseekbar-1.0.0.jar Required by: SampleApplication:app:unspecified

    Thoughts? Thanks!!

    opened by kylemallory 1
  • about the setOnColorChangeListener callback

    about the setOnColorChangeListener callback

    Is it possible to return a value to the listener callback method to determine whether it is the value of the user's manual sliding, or the value of the callback through setColorSeeds()

    opened by amosxb 0
  • Add option to change ColorBar color on new colorSeeds

    Add option to change ColorBar color on new colorSeeds

    Hi there! I was trying to build an app with two ColorSeekBars - one to control the hue of my view and one to control the saturation. When I change my hue colorSeekBar, the colorSeeds of my saturation colorSeekBar change to (Color.WHITE, hueSeekBar.getColor()). This works well, but when I try dragging the saturationSeekBar, the color of the thumb remains unchanged (the original value). How would I go about doing this? Thank you!

    App

    opened by EddieXu123 7
  • Add option to lock thumb

    Add option to lock thumb

    Hey!

    Thanks for this nice library!!

    I'm using it to display temperature values. Therefore it would be great to be able to lock the thumb at set position. Any chance to implement this?

    Thanks, Rob

    opened by r748 0
  • java.lang.IllegalArgumentException: width and height must be > 0 - vers.1.4.2

    java.lang.IllegalArgumentException: width and height must be > 0 - vers.1.4.2

    I tried using version 1.4.3, but not resolving it. More recent version I can compile against is 1.4.2, that gives me this error. Switching back to 1.2.2, everything is fine. I make plain usage in XML:

    <com.rtugeek.android.colorseekbar.ColorSeekBar android:id="@+id/colorSliderStop" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/stopLabel" app:colorSeeds="@array/t16_color_slider" />

    opened by shineangelic 6
Releases(2.0.3)
Owner
Jack Fu
If God exists, she must be a programmer.
Jack Fu
A SeekBar suited for showing a preview of something. As seen in Google Play Movies.

PreviewSeekBar A SeekBar suited for showing a video preview. As seen in Google Play Movies Google Play Movies PreviewSeekBar's sample Build Add the fo

Rúben Sousa 3.3k Jan 3, 2023
 A beautiful and powerful SeekBar what supports single、 range、steps、vetical、custom( 一款美观强大的支持单向、双向范围选择、分步、垂直、高度自定义的SeekBar)

文档还是中文好 Demo APK download fir.im Usage Dependencies Release Version allprojects { repositories { ... maven { url 'https://jitpack.io' }

null 2.3k Jan 5, 2023
Circular SeekBar view for Android

SeekArc What is a SeekArc? So what the heck is a SeekArc? Essentially it’s a SeekBar that has been wrapped around a circle. It acts like a SeekBar and

Neil Davies 870 Dec 10, 2022
Custom circular SeekBar (Circle, Semi-circle, and Ellipse) View/Widget for Android

CircularSeekBar Android CircularSeekBar Custom View/Widget This is a custom circular SeekBar. It can be used to create SeekBars that are: -Full Circle

Matt Joseph 462 Dec 19, 2022
A seekbar contains two cursor(left and right). Multiple touch supported.

RangeSeekbar A seekbar contains two cursor and support multi-touch. RangeSeekbar have left and right cursors, user can move cursor to make fliter. How

dolphinWang 283 Mar 28, 2022
Android circle seekbar widget inspired from: https://github.com/LarsWerkman/HoloColorPicker

Android HoloCircleSeekBar A Circle SeekBar inspired by Android Holo ColorPicker designed by Marie Schweiz and developed by Lars Werkman. How to integr

Jesus 232 Nov 10, 2022
StartPointSeekBar is a custom view for the Android platform that makes it possible to have a SeekBar to have custom start point.

Forked/Inspired from https://code.google.com/p/range-seek-bar/ by [email protected] This solves the problem as described in http://

Gaurav Vashisth 142 Dec 29, 2022
Ranger is custom view which able to act like android seekbar.

Ranger is custom view which able to act like android seekbar.

Enes Zor 3 Oct 17, 2021
🎨 A color picker for Android. Pick a color using color wheel and slider (HSV & alpha).

ColorPicker English | 中文 A ColorPicker for Android. Pick a color using color wheel and slider (HSV & alpha). Gradle dependencies { implementation

Hong Duan 313 Dec 14, 2022
A color picker seekbar for android.

ColorSeekBar A color picker seekbar for android. Download Use Gradle compile 'com.divyanshu.colorseekbar:colorseekbar:1.0.2' or Maven <dependency>

Divyanshu Bhargava 129 Nov 29, 2022
Navigation tab bar with colorful interactions.

NavigationTabBar Navigation tab bar with colorful interactions. You can check the sample app here. Warn This library is not more supported. If you wa

Devlight 4.9k Dec 31, 2022
Simple android view to display list of colorful tags efficiently.

Android TagView Simple android view to display collection of colorful tags efficiently. Library uses TextView as a base, and creates custom Spanes to

Michał Charmas 175 Nov 11, 2022
A smart colored time selector. Users can select just free time with a handy colorful range selector.

Colored Time Range Selector A smart colored time range selector. Users can select just free time with a handy colorful range selector. Screen Shots Fe

Ehsan Mehranvari 154 Oct 3, 2022
Colorful Sliders written with Jetpack Compose that enliven default sliders

???? ?? Colorful Sliders written with Jetpack Compose that enliven default sliders with track and thumb dimensions, and gradient colors, borders, labels on top or at the bottom move with thumb and ColorfulIconSlider that can display emoji or any Composable as thumb

Smart Tool Factory 70 Dec 30, 2022
A progress bar with animation, gradient and colorful shadow.

Fancy Progressbar Android library providing a beautiful progressbar with colorful shadow, gradient and animation for Jetpack Compose. Download Add in

Fatemeh Afshari 5 Dec 25, 2022
For color lovers! A simple but powerful Android color picker

#DEPRECATED Credits for the logo goes to Hafiz Ahmmed (https://github.com/hafizahmmed) ColorBox library Features Dynamic color preview; Change the col

Enrico D'Ortenzio 53 Apr 8, 2021
A color picker and a color preference for use in Android applications.

HSV-Alpha Color Picker for Android This library implements a color picker and a color preference for use in Android applications. Features I couldn't

Martin Stone 279 Nov 26, 2022
Color.kt is a modern color science library for Kotlin Multiplatform and Java.

Color.kt is a modern color science library for Kotlin Multiplatform and Java. It includes modern perceptually-uniform color spaces and color appearance models, such as Oklab and ZCAM.

Danny Lin 45 Oct 11, 2022
Color.kt is a modern color science library for Kotlin Multiplatform and Java.

Color.kt is a modern color science library for Kotlin Multiplatform and Java. It includes modern perceptually-uniform color spaces and color

SOSP-OS 0 Jan 21, 2022
This is an android studio plugin that allows you to creates new color in hex format based on a percentage (0-100) and a base color you specify.

alpha-color Description This is an android studio plugin that allows you to creates new color in hex format based on a percentage (0-100) and a base c

null 1 Nov 12, 2021