CODEWITHSUNDEEP
androidandroid-layoutandroid-custom-viewandroid-seekbar
Bobby_th
Bobby_th

Reputation: 91

Custom layout or design for seekbar

Is there a way to customize the look of the seek bar, so that I can put my own design/image for the seekbar (thumb, track and progress). I have looked at this post, but the link is broken.

How to create custom layout for seekbar in android?

Thanks

Upvotes: 3

Views: 688

Answers (1)

GuilhE
GuilhE

Reputation: 11861

This may help custom seekbar, you can change what you want (thumb, track and progress, and more usefull stuff) but only programmatically. I've contributed to this lib, the only catch is that this seekbar it's a range seekbar, but you can fork this repo and add the feature to enable range or not and remove one of the thumbs.

The quickest way to achieve that is to comment line 498 from RangeSeekBar.java (but you'll only affect the "visibility" the thumb still reacts to drag, you have to code a bit more ^^)

// draw minimum thumb
drawThumb(normalizedToScreen(mNormalizedMinValue), Thumb.MIN.equals(mPressedThumb), canvas);

and then inside your Activity you'll be using the maxValue:

mSeekBar.setOnRangeSeekBarChangeListener(new RangeSeekBar.OnRangeSeekBarChangeListener<Integer>() {
    @Override
    public void onRangeSeekBarValuesChanged(RangeSeekBar<?> bar, Integer minValue, Integer maxValue) {
        ...
        }
    });

Here's an example on how to customize your seekBar:

mSeekBar.setNotifyWhileDragging(true);
mSeekBar.setThumbImage(BitmapFactory.decodeResource(getResources(), R.drawable.seek_thumb_normal));
mSeekBar.setProgressBackgroundColor(0xFF, 0xDD, 0xDD, 0xDD);
mSeekBar.setProgressLineColor(0xFF, 0xE8, 0x4E, 0x44);
mSeekBar.setMaxHeight(Utils.convertDpToPx(getActivity(), 2));

enter image description here enter image description here

Or you use Android layout configurations:

<SeekBar
          ...
          android:progressDrawable="@drawable/seekbar_default_progress"
          android:thumb="@drawable/seek_thumb"/>


<item android:id="@android:id/progress">
    <clip android:drawable="@color/some_color"/>
</item>

Upvotes: 2

Related Questions