Detecting thumb position in SeekBar prior to API version 16

Question

Basically, I need to detect when the progress changes in the SeekBar and draw a text view on top of the thumb indicating the progress value.

I do this by implementing a

Answer 1

@Sherif elKhatib's answer is great but has the disadvantage of caching a copy of the thumb even on API>=16. I've improved it so that it only caches the Thumb Drawable on API<=15 plus it overrides the method in SeekBar.java to avoid having two methods do the same on API>=16. Only downside: It needs target SDK to be >= 16 which should be the case in most apps nowadays.

public class ThumbSeekBar extends AppCompatSeekBar {

    private Drawable thumb;

    public ThumbSeekBar(Context context) {
        super(context);
    }

    public ThumbSeekBar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ThumbSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public Drawable getThumb() {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            return super.getThumb();
        }
        return thumb;
    }

    @Override
    public void setThumb(Drawable thumb) {
        super.setThumb(thumb);
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
            this.thumb = thumb;
        }
    }
}

Answer 2

A splendid solution! Thanks. It's only nessesary to add that to use custom seekbar you need modify your xml

 <com.example.MySeekBar
      android:id="@+id/..."
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:layout_gravity="center_vertical"
      android:layout_weight="1"
      android:minHeight="3dp"
      android:maxHeight="3dp"
      android:progressDrawable="@drawable/seek_bar_2"
      android:thumb="@drawable/thumbler_seekbart_circle"
      android:thumbOffset="8dp" />

android:thumbOffset="8dp" - is a HALF of a thumb it's better to spesify, thus there will be no mismatching of the text center and the thumb

Positioning can look like this:

int possition = (int) (seekBar.getX() //the beginning of the seekbar
+ seekBar.getThumbOffset() / 2        //the half of our thumb - the text to be above it's centre
+ ((MySeekBar) seekBar).getSeekBarThumb().getBounds().exactCenterX()); //position of a thumb inside the seek bar

Answer 3

I was able to use my own class to get the Thumb:

MySeekBar.java

package mobi.sherif.seekbarthumbposition;

import android.content.Context;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.SeekBar;

public class MySeekBar extends SeekBar {

    public MySeekBar(Context context) {
        super(context);
    }
    public MySeekBar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    public MySeekBar(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    Drawable mThumb;
    @Override
    public void setThumb(Drawable thumb) {
        super.setThumb(thumb);
        mThumb = thumb;
    }
    public Drawable getSeekBarThumb() {
        return mThumb;
    }

}

In the activity this works perfectly:

package mobi.sherif.seekbarthumbposition;

import android.app.Activity;
import android.graphics.Rect;
import android.os.Bundle;
import android.util.Log;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;

public class MainActivity extends Activity implements OnSeekBarChangeListener {
    MySeekBar mSeekBar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mSeekBar = (MySeekBar) findViewById(R.id.seekbar);
        mSeekBar.setOnSeekBarChangeListener(this);
    }
    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean b) {
        Rect thumbRect = mSeekBar.getSeekBarThumb().getBounds();
        Log.v("sherif", "(" + thumbRect.left + ", " + thumbRect.top + ", " + thumbRect.right + ", " + thumbRect.bottom + ")");
    }
    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {
        // TODO Auto-generated method stub

    }
    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
        // TODO Auto-generated method stub

    }
}

Answer 4

Hopefully this can save some hours for someone else!

I created this method instead of a custom seekBar:

public int getSeekBarThumbPosX(SeekBar seekBar) {
    int posX;
    if (Build.VERSION.SDK_INT >= 16) {
        posX = seekBar.getThumb().getBounds().centerX();
    } else {
        int left = seekBar.getLeft() + seekBar.getPaddingLeft();
        int right = seekBar.getRight() - seekBar.getPaddingRight();
        float width = (float) (seekBar.getProgress() * (right - left)) / seekBar.getMax();
        posX = Math.round(width) + seekBar.getThumbOffset();
    }
    return posX;
}