Vlad Iancu
Vlad Iancu

Reputation: 487

Requesting guidance in creating custom SeekBar in Android. (like shown in the image)

I have a task to create a SeekBar looking like this:

enter image description here

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

Answers (2)

Vlad Iancu
Vlad Iancu

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

enter image description here

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

piotrek1543
piotrek1543

Reputation: 19351

I already see two ways to do it

  1. Using background Drawable

    Create and choose your seekbar drawable using setBackgroundDrawable().

  2. Use third-party libraries:

RangeSliderView: (min. SDK API 14):

https://github.com/channguyen/range-slider-view

enter image description here

RangeSeekbar:

https://github.com/dolphinwang/RangeSeekbar

RangeBar:

https://github.com/edmodo/range-bar

Check also this unfinished project: https://github.com/feelinglucky/RadioSeekBar

Hope it help

Upvotes: 3

Related Questions