Reputation: 487
I have a task to create a SeekBar looking like this:
My question is: How to segment the seekbar like that? I have made custom seekbars before, but I don't know how to segment the bar like that, with lines extending beyond the seekbar's height.
I have stumbled across a library, the ComboSeekBar, but it doesn't help much.
Thanks in advance to anyone willing to help!
Cheers!
Upvotes: 6
Views: 2877
Reputation: 487
For anyone needing to create a similar Seekbar like me:
This library was exactly what I needed, except the fact that it has 2 thumbs, and no way to eliminate one of them.
https://github.com/edmodo/range-bar
I have devised a little "hack" for this: When you initialize the Range-Bar, you can set the thumb indices via this method, as stated in the wiki:
RangeBar rangebar = (RangeBar) findViewById(R.id.rangebar);
rangebar.setThumbIndices(5,5); //indices example
And when a thumb index changes, in the following method you set the seekbar thumbs to the same position:
rangebar.setOnRangeBarChangeListener(new RangeBar.OnRangeBarChangeListener() {
@Override
public void onIndexChangeListener(RangeBar rangeBar, int leftThumbIndex, int rightThumbIndex) {
//Code using the leftThumbIndex and rightThumbIndex to update the index values.
rangeBar.setThumbIndices(leftThumbIndex, leftThumbIndex);
}
});
Hope it will be of use for anyone.
Thanks everyone for the help!
Cheers!
Upvotes: 0
Reputation: 19351
I already see two ways to do it
Using background Drawable
Create and choose your seekbar drawable using setBackgroundDrawable()
.
Use third-party libraries:
RangeSliderView: (min. SDK API 14):
https://github.com/channguyen/range-slider-view
RangeSeekbar:
https://github.com/dolphinwang/RangeSeekbar
RangeBar:
Check also this unfinished project: https://github.com/feelinglucky/RadioSeekBar
Hope it help
Upvotes: 3