Changing Android SeekBar to draw secondary progress on top of primary progress?

Question

I would like to change the behavior of an android seekbar so that the secondary android seekbar is actually drawn on top of the primary android seekbar. From the ProgressBar doc

Answer 1

This is a late answer, but just I found out how to do this. Not that difficult :)

First of all look at how the progress drawable is defined in the android project [here].(https://github.com/android/platform_frameworks_base/blob/master/core/res/res/drawable/progress_horizontal_holo_dark.xml)

All you have to do is switch the order of secondaryProgress and progress so that progress comes before (lies below) secondaryProgress like this:

<item android:id="@android:id/background"
      android:drawable="@android:drawable/progress_bg_holo_dark" />

<item android:id="@android:id/progress">
    <scale android:scaleWidth="100%"
           android:drawable="@android:drawable/progress_primary_holo_dark" />
</item>

<item android:id="@android:id/secondaryProgress">
    <scale android:scaleWidth="100%"
           android:drawable="@android:drawable/progress_secondary_holo_dark" />
</item>

Now sadly those resources are not public. So you will have to copy progress_bg_holo_dark.9.png, progress_primary_holo_dark.9.png and progress_secondary_holo_dark.9.png to your projects drawable-xhdpi folder (and maybe to the same with other dpi images as well).

Then adjust the xml file like the following (just remove "android:"):

<item android:id="@android:id/background"
      android:drawable="@drawable/progress_bg_holo_dark" />

<item android:id="@android:id/progress">
    <scale android:scaleWidth="100%"
           android:drawable="@drawable/progress_primary_holo_dark" />
</item>

<item android:id="@android:id/secondaryProgress">
    <scale android:scaleWidth="100%"
           android:drawable="@drawable/progress_secondary_holo_dark" />
</item>