jay-goo / rangeseekbar

 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' }
		}
	}

	dependencies {
		// sample: implementation 'com.github.Jay-Goo:RangeSeekBar:v3.0.0'
	        implementation 'com.github.Jay-Goo:RangeSeekBar:Release Version'
	}

How to use it

Please See WIKI！WIKI！WIKI！

Give me a Star

Hope you like RangeSeekBar. Star is the greatest support for me！ Thank you !

A cup of coffee

Open source is a hard job, and a cup of coffee may be a good reward.

Contact Me

• Email： [email protected]
• QQ Group: 573830030

License

Copyright 2018-2019 JayGoo

Licensed under the Apache License.

rangeseekbar's Issues

我想用View显示我选择的区间

Attention

You can know almost all useage and questions in the WIKI, please confirm you have read them before you question!

Environment

• Device: [Google Pixel2]
• OS: [6.0.1]
• Library Version: [2.0.2]

Description
What's wrong with you ?

Screenshots
If applicable, add screenshots to help explain your problem.

注意

你几乎可以从 WIKI获取几乎所有的用法和常见问题, 在你提问之前请确认你已经看过以上内容!

环境

• 设备: [Google Pixel2]
• 系统: [6.0.1]
• 库版本: [2.0.2]

描述

截图

Change hint background color

Is there a way to change hint background color?

I need set secondary seekbar. how to implement?

hi, thank you for useful RangeSeekBar library. can you add secondary bar on this RangeSeekBar? i need to it. thanks

sb bg ------------------------------
sb rang -------|----------|------------
sb sec -------|~~~~~~|------------

Is there a way to divide this seekbar into checkpoints?

i'm developing an app which display food item prices in android seek-bar..food items has 3 main prices(small, regular and large). I wanted the seek bar to move only to 0th(small price), 100th(large price) and middle(regular price) positions only, and display the price of regular if seek-bar is in middle position, etc...
How can I achieve this using this repo?
Any help would be appreciated.

Change default min max value to time value

Hello Jay-Goo,

I'm using this library for time range bar, now we want to convert default value to time value,
like suppose i set max value 24 then your library return to me time value(ex., 23.50, 22.30,20.20 or 20.12 but not 23.90, 22.81, 23.92, 22.75,21. etc.,).

Thanks.

滑动条上面的数字气泡为啥不显示

滑动条上面的数字气泡为啥不显示

rsb_progressHintMode 设置alwaysShow ， 能不能在触发拖动前也显示进度提示

onRangeChanged 关于该方法的调用bug

问题：
情景：设置最小进度为0，最大进度为100.
当用手滑动时，此方法触发，返回的min和max是 0-100之间，
当我们调用setValue(min,max)时，返回的是0-1的百分比。

大概看了下源码，
setValue中传入的是curPercent.
if (callback != null) { if (rightSB != null) { callback.onRangeChanged(this, leftSB.currPercent, rightSB.currPercent, false); } else { callback.onRangeChanged(this, leftSB.currPercent, leftSB.currPercent, false); } }

手势监听中传入的是states.
callback.onRangeChanged(this, states[0].value, states[1].value, true);

Is it possible to implement an onStopTrackingTouch?

Hi,

Is it possible to add support for the function onStopTrackingTouch present in the standard SeekBar ? (i.e. it is called when the user stops changing the progress of the bar). It really helps when we need to change an attribute only when the user sets the value "as final", without having to write to a complex object each time the range changes.

Thanks in advance!

Can we change the range of RangeSeekBar

Can we change the range of RangeSeekBar say for example from 0 to 5 only, rather than 0 to 100 on sliding the seekbar.

提交几处 bug

@JinJieGu
你好，我发现几个BUG：

1. 除setValue外的其他 set 方法需要调用setRangeRules，否则不会生效。

2. rsb_mode为range时，tickMarkNumberonRangeChanged回调的 max值永为最大值，原因是getRangeSeekBarState()方法中rightSeekBarState.value = range的问题。改为rightSeekBarState.value = -offsetValue + minPositiveValue + range * rightSB.currPercent;则解决问题

3. getRangeSeekBarState() 方法中为rightSeekBarState赋值错误，leftSeekBarState.indicatorText = tickMarkTextArray[index].toString();应改为 rightSeekBarState.indicatorText = tickMarkTextArray[index].toString();

Min Progress & Max Progress not getting correctly set.

Attention

Min Progress & Max Progress not getting correctly set.

Environment

• Device: [Red MI Note 4]
• OS: [6.0.1]
• Library Version: [2.0.2]

Description
I want to set minProgress & maxProgress values problematically , i don't want to set them through xml.
As i am using the methods as follows,
seekbar_search_euronorm.minProgress = 1f
seekbar_search_euronorm.maxProgress = 10f

It sets the min,max but as soon as i change range of seek bar it shows me value from 1-100 within seekbar , but given limit for min = 1 & max = 10 which i previously set by methods.

Screenshots
No screenshots

如何动态设置步长呢？

想动态设置步长，也就是递增滑动，刚开始增速慢，后面增速变快，大概看了下setCellsCount，但是不生效。谢谢

How Set costume font(Typeface) in Left & Right Seek Bar?

Hello JinJieGu,

I want to set font(Typeface) in min & max text,
how can i do it?

Thanks.

最低版本号16 是不是有点高啊

能否支持，seekBar选择的最小值 和 最大值

如何把它进行竖着滑动

Sample crash randomly

Hi, nice lib. I just got this crash randomly from your sample app. It seems it occur from AppCompatActivity.onStart

java.lang.RuntimeException: Unable to start activity ComponentInfo{}: java.lang.ClassCastException: android.view.View$BaseSavedState cannot be cast to com.jaygoo.widget.RangeSeekBar$SavedState
at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2666)
at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2727)
at android.app.ActivityThread.-wrap12(ActivityThread.java)
at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1478)
at android.os.Handler.dispatchMessage(Handler.java:102)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6121)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:889)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:779)
Caused by: java.lang.ClassCastException: android.view.View$BaseSavedState cannot be cast to com.jaygoo.widget.RangeSeekBar$SavedState
at com.jaygoo.widget.RangeSeekBar.onRestoreInstanceState(RangeSeekBar.java:1040)
at android.view.View.dispatchRestoreInstanceState(View.java:15755)
at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3237)
at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3237)
at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3237)
at android.view.ViewGroup.dispatchRestoreInstanceState(ViewGroup.java:3237)
at android.view.View.restoreHierarchyState(View.java:15733)
at android.support.v4.app.Fragment.restoreViewState(Fragment.java:475)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1329)
at android.support.v4.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManager.java:1528)
at android.support.v4.app.FragmentManagerImpl.moveToState(FragmentManager.java:1595)
at android.support.v4.app.FragmentManagerImpl.dispatchActivityCreated(FragmentManager.java:2900)
at android.support.v4.app.FragmentController.dispatchActivityCreated(FragmentController.java:201)
at android.support.v4.app.FragmentActivity.onStart(FragmentActivity.java:603)
at android.support.v7.app.AppCompatActivity.onStart(AppCompatActivity.java:178)

Do you have any idea how to fix it ?

How to always enable the shape on the top of thumb ?

Always show the shape on the top of the thumb drawable.

初始显示值

如何设置双向滑块 初始的位置？？？如何获得滑块滑动之后的刻度值？？

左边的圆角为什么不见了，成直角了

Keep Showing values of badges

Hi i am using rangeseekbar , and keep want to show the values on top of the badges , currently value only comes when i scroll , how i can the selected current value all the times on top of badges.

希望可以发布到jcenter

虽然jitpack也能用，但还是jcenter比较好

重置,setMin,setMax

有重置功能么?让他归到最左边的值,或者手动设置最大值和最小值自动跳转到对应刻度

android 7.0以上系统，DEMO不显示

android 7.0以上系统，DEMO中的第一个示例没有显示出来，onMeasure()方法是调用了的，高度值也是有的，麻烦解答一下

如何设置步长

如何设置步长

How can i use simple image on indicator

Attention
Can we use simple image on indicator other then nine patch image..

Environment

• Device: [Google Pixel2]
• OS: [6.0.1]
• Library Version: [2.0.2]

Description
What's wrong with you ?

Screenshots
If applicable, add screenshots to help explain your problem.

注意

你几乎可以从 WIKI获取几乎所有的用法和常见问题, 在你提问之前请确认你已经看过以上内容!

环境

• 设备: [Google Pixel2]
• 系统: [6.0.1]
• 库版本: [2.0.2]

描述

截图

number typeface

Hi , I want to use this library in a Persian application. There is no way to change the number typeface?

属性名称冲突

建议属性名称增加前缀，不然很大几率会冲突
在项目引入

implementation 'com.android.support:preference-v14:26.1.0'
implementation 'com.github.Jay-Goo:RangeSeekBar:v1.1.0'

就会造成 min 这个属性冲突了

Is there no getValue? (also: numbers after decimal point AND indicator corner radius)

I only found setValue but no getValue.
There's getMinProgress and getMaxProgress, but in a slider of 0-10 they will only return 0 and 10.
The most basic functionality of a slider is to be able to give me the value the user chose.
What am i missing?

I had to set a listener and take the min value from it, and put it into a variable.
But this means that this variable changes all the time when the user slides the slider.
I just want to take the final/current value and use it for something.

Two other smaller issues:

1. I can set the seekbar to display a specific number format (for example 0.1 instead of 0.12345), but the actual value remains 0.12345 when i try to use the seekbar value elsewhere. is there a way to control the output or the intervals?
2. I see on the first demo gif, the 3rd indicator has a corner radius, but i could not find a way to set this in the XML or in the JAVA. Is there a way?

当两个在右边重叠在一起时 左边的游标被右边的覆盖 很难滑回来

Will editing the values file for your library cause a issue within your library?

I have this person working with me who is saying that if we edit the values file in the output folder in the main library (here on GitHub) get's reflected with changes and it could cause problems with the library.

For instance I wanted 3 seekbars and I needed to set checkpoints for each of them so what I did is I added this piece of code,

<string-array name="markArray2">
        <item>6</item>
        <item>12</item>
        <item>18</item>
        <item>24</item>
    </string-array>
    <string-array name="markArray3">
        <item>3</item>
        <item>6</item>
        <item>9</item>
        <item>12</item>
    </string-array>

Similar code which comes when library is default run first time. Did I do it wrong?

VerticalSeekbar

请问是否可以设置成垂直的？如果不行，请问有写过这样的吗？谢谢！

Can u increase hit area of thumb ?

First sorry for my english, i used your library for my project, i really like it, but one small thing, it's too difficult for hit the thumb, my thumb size is 12dp.

我设置hideProgressHint为true的时候，ProgressHint的高度仍然存在

如题：代码中
mHintBGHeight = mHintBGHeight == 0 ? (mCursorPaint.measureText("国") * 3) : mHintBGHeight;
设置ProgressHint高度少了hide的判断~ 目前我通过gradle集成的~ 设置app:hintBGHeight > 0 可以规避到这个问题

怎么设置每次滑动的步幅呢

Attention

You can know almost all useage and questions in the WIKI, please confirm you have read them before you question!

Environment

• Device: [Google Pixel2]
• OS: [6.0.1]
• Library Version: [2.0.2]

Description
What's wrong with you ?

Screenshots
If applicable, add screenshots to help explain your problem.

注意

你几乎可以从 WIKI获取几乎所有的用法和常见问题, 在你提问之前请确认你已经看过以上内容!

环境

• 设备: [Google Pixel2]
• 系统: [6.0.1]
• 库版本: [2.0.2]

描述

截图

如何设置刻度在下方显示

如何设置刻度在下方显示 ？？默认刻度的文字是在上面显示的。

Binary XML file Error inflating class com.jaygoo.widget.RangeSeekBar

Hello JinJieGu,

I'm facing error in XML file like :=> Caused by: android.view.InflateException: Binary XML file line #57: Binary XML file line #57: Error inflating class com.jaygoo.widget.RangeSeekBar,

i tested in more than 4 device but in some device this library not working & in some device working fine,

Not Working Devices:=>

1. Name :=>Moto G Play, Os Version:=> 6.0.1
2. Name :=>Gionee P5 Mini, Os Version:=> 5.1.1

Working Devices :=>

1. Name :=>Moto C Plus, Os Version:=> 7.1
2. Name :=>Samsung OnNext, Os Version:=> 7.0

My Code:=>

<com.jaygoo.widget.RangeSeekBar
android:id="@+id/amft_monRangeBar"
android:layout_width="match_parent"
android:layout_height="@dimen/_60sdp"
app:rsb_indicator_background_color="@color/colorTransperant"
app:rsb_indicator_height="@dimen/_20sdp"
app:rsb_indicator_show_mode="alwaysShow"
app:rsb_indicator_text_color="@color/colorBlack"
app:rsb_indicator_width="@dimen/_40sdp"
app:rsb_max="23.59"
app:rsb_min="0"
app:rsb_mode="range"
app:rsb_progress_color="@color/colorAccent"
app:rsb_progress_default_color="@color/colorBlack"
app:rsb_progress_height="@dimen/_3sdp"
app:rsb_range_interval="0.001"
app:rsb_thumb_drawable="@drawable/thumb_gradient"
app:rsb_thumb_size="@dimen/_20sdp"
app:rsb_tick_mark_mode="number"
app:rsb_tick_mark_text_margin="17dp"
app:rsb_tick_mark_text_size="16sp" />

Thanks.

两个bug

1. 关于setvalue方法
   if (callback != null) {
   if (mSeekBarMode == 2) {
   callback.onRangeChanged(this, leftSB.currPercent, rightSB.currPercent, false);
   }else {
   callback.onRangeChanged(this, leftSB.currPercent, leftSB.currPercent, false);
   }
   }
   我看其他时候传的都是实际值，这里怎么是百分比

2.BitmapFactory.decodeResource(getResources(), mThumbId)
这个方法只能解析原生的bitmap，不能解码自定义的Drawable，建议
getResources().getDrawable(mThumbResId)并将其转为bitmap
public static Bitmap drawableToBitmap (Drawable drawable) {
Bitmap bitmap = null;

    if (drawable instanceof BitmapDrawable) {
        BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
        if(bitmapDrawable.getBitmap() != null) {
            return bitmapDrawable.getBitmap();
        }
    }

    if(drawable.getIntrinsicWidth() <= 0 || drawable.getIntrinsicHeight() <= 0) {
        bitmap = Bitmap.createBitmap(1, 1, Bitmap.Config.ARGB_8888); // Single color bitmap will be created of 1x1 pixel
    } else {
        bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
    }

    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
    drawable.draw(canvas);
    return bitmap;
}

Can not add library via gradle

Can not add library to the gradle when i paste below command in dependencies. Is there a problem with library ?

implementation 'com.github.Jay-Goo:RangeSeekBar:v2.0.1'

set margin or padding between left and right seek bar(overriding left & right seekbar).

Hello jay-goo,
I'm using this library, it's working fine, but overriding text left & right range seek bar,
i set app:rsb_indicator_padding_bottom="0dp"
app:rsb_indicator_padding_left="20dp"
app:rsb_indicator_padding_right="20dp"
app:rsb_indicator_padding_top="0dp"
app:rsb_indicator_margin="8dp"
in xml file & also set in java file:=>
binding.amftMonRangeBar.getLeftSeekBar().setIndicatorPaddingLeft(20);
binding.amftMonRangeBar.getLeftSeekBar().setIndicatorPaddingRight(20);
binding.amftMonRangeBar.getRightSeekBar().setIndicatorPaddingLeft(20);
binding.amftMonRangeBar.getRightSeekBar().setIndicatorPaddingRight(20);
binding.amftMonRangeBar.getLeftSeekBar().setIndicatorMargin(8);
binding.amftMonRangeBar.getRightSeekBar().setIndicatorMargin(8);

but both left & right indicator text overriding.

How can i keep space between left & right seekbar.
see below attachment.

Thanks.

怎么设置气泡内的数字不是小数,怎么设置步进?

如题:怎么设置气泡内的数字不是小数,怎么设置步进?

how set programmatically rsb_max and rsb_min?

Environment

• Library Version: [2.0.2]

how set rsb_max and rsb_min programmatically? setMinProgress and setMaxProgress does not work

Tap to move thumb position.

Is there any possibility to implement tap-to-set desired thumb position without dragging the thumb?

how can i use setMax ??

not able to set min and max value(programatically)

能自动设置单位吗

比如以10为单位移动

Change hint image color when it is reaching maximum range

Hi,

I'm using your library to show range bar in app,i want to change the color of the hint when it is near to or at maximum range.Is it possible can you guide me for this.

Programatically setting range not working

Hi I use your library to display a range of values. Let's say from 1 to 8 with step 1. I also display labels above each step, so in general I set an array of Strings to display.

I use in XML like :

<com.jaygoo.widget.RangeSeekBar
                        android:id="@+id/salary_sb"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:rsb_indicator_arrow_size="0dp"
                        app:rsb_indicator_background_color="@color/color_transparent"
                        app:rsb_indicator_height="@dimen/icon_small"
                        app:rsb_indicator_padding_bottom="0dp"
                        app:rsb_indicator_show_mode="alwaysShow"
                        app:rsb_indicator_text_color="@color/text_color_normal"
                        app:rsb_indicator_text_size="@dimen/text_tiny"
                        app:rsb_mode="range"
                        app:rsb_progress_color="@color/color_blue"
                        app:rsb_progress_height="@dimen/divider_height_thick"
                        app:rsb_progress_radius="@dimen/corner_radius_small"
                        app:rsb_thumb_size="@dimen/icon_small"
                        app:rsb_tick_mark_text_color="@color/color_transparent" />

and I set my data like :

mSalarySb.setSeekBarMode(RangeSeekBar.SEEKBAR_MODE_RANGE);
        mSalarySb.setTickMarkMode(RangeSeekBar.TRICK_MARK_MODE_OTHER);
        mSalarySb.setRangeInterval(1);
        mSalarySb.setTickMarkNumber(ranges.length -1);
        mSalarySb.setTickMarkTextArray(ranges);
        mSalarySb.invalidate();

This displays the first value and has one step with the last value. All steps between are lost.

I tried to set it up with dummy data in XML only (resource array of predefined Strings) and it seems to work fine.

STATIC DATA:

 <string-array name="salary_ranges">
        <item>$ 0</item>
        <item>$ 3000</item>
        <item>$ 5000</item>
        <item>$ 7000</item>
        <item>$ 10000</item>
    </string-array>

XML:

<com.jaygoo.widget.RangeSeekBar
                        android:id="@+id/salary_sb"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:rsb_indicator_arrow_size="0dp"
                        app:rsb_indicator_background_color="@color/color_transparent"
                        app:rsb_indicator_height="@dimen/icon_small"
                        app:rsb_indicator_padding_bottom="0dp"
                        app:rsb_indicator_show_mode="alwaysShow"
                        app:rsb_indicator_text_color="@color/text_color_normal"
                        app:rsb_indicator_text_size="@dimen/text_tiny"
                        app:rsb_mode="range"
                        app:rsb_progress_color="@color/color_blue"
                        app:rsb_progress_height="@dimen/divider_height_thick"
                        app:rsb_progress_radius="@dimen/corner_radius_small"
                        app:rsb_range_interval="1"
                        app:rsb_thumb_size="@dimen/icon_small"
                        app:rsb_tick_mark_mode="other"
                        app:rsb_tick_mark_number="4"
                        app:rsb_tick_mark_text_array="@array/salary_ranges"
                        app:rsb_tick_mark_text_color="@color/color_transparent" />

Did I miss something when I set it up programmatically ?

Progress radius doesn't work!

Environment

• Device: Huawei Y7 Prime
• OS: [8.0.0]
• Library Version: [2.0.2]

Description

Can't manage to add progress radius, i tries these approaches:

<com.jaygoo.widget.RangeSeekBar
                android:id="@+id/add_found_age_seek_bar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:rsb_max="30"
                app:rsb_min="0"
                app:rsb_mode="range"
                app:rsb_indicator_show_mode="alwaysShow"
                app:rsb_indicator_height="32dp"
                app:rsb_range_interval="1"
                app:rsb_indicator_padding_left="8dp"
                app:rsb_indicator_padding_right="8dp"
                app:rsb_progress_color="@color/colorAccent"
                app:rsb_tick_mark_mode="number"
                app:rsb_tick_mark_number="1"
                app:rsb_progress_radius="0.8dp"  // or 50dp
                app:rsb_tick_mark_text_array="@array/age_marks"/>

or this:

seekBar.setProgressRadius(0.8f);
seekBar.invalidate();

Neither of them seem to make the slightest difference...

Shouldn't the purple square have a radius now?

Screenshots

Padding to the thumb indicator

@JinJieGu How do I add padding to thumb indicator?

Suppose I have a RangeBar from 0 to 200000. the thumb indicator area becomes too small to slide through the range.!!

If there is no way to set padding for a thumb indicator, can you suggest some workaround to get going?