Custom seek bar with thumb and progressDrawable

Question

I try to customize seek bar like below

But problem is that 
-thumb image not set with text 
-thumb position can not set above seekbar.
-android:progressDrawable should not repeat as below  

My Code is as below:

         <SeekBar
            android:id="@+id/volume_bar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:max="100"
            android:progress="20"                
            android:progressDrawable="@drawable/bar"
            android:secondaryProgress="0"                
            android:thumb="@drawable/greenarrow" />

Answer 1

I've tried doing this, but I ran into problems with response time the way I did it. Having to move the margins took a lot of processing power and time. It was close to 400-500ms. So I had to remove it.

However, here are the steps I took: First, I would suggest creating a frame layout to hold both the SeekBar and a TextView. Then, depending on the percentage of the progress bar, you can set the TextViews layout property margins. Does that make sense?

If you would like specific code, I can get that to you, but google does pretty good too. :)

Option B: Android seekbar with custom thumb having dynamic text inside it