17

I have a SeekBar with a custom drawable for the Thumb, and I would like to be able to show/hide it based on another control I have.

I have tried loading the drawable from resources, and then using SeekBar.setThumb() with the drawable, or null.

That hides it (the set to null), but I can never get it back.

Andrew Mackenzie
  • 5,477
  • 5
  • 48
  • 70

6 Answers6

28

The best way to do this is to set the drawable for the thumb from XML (as I was doing all along) and then when you want to hide/show the Thumb drawable, just manipulate it's alpha value:

// Hide the thumb drawable if the SeekBar is disabled
if (enabled) {
    seekBar.getThumb().mutate().setAlpha(255);
} else {
    seekBar.getThumb().mutate().setAlpha(0);
}

Edit:

If thumb appearing white after setting alpha to zero, try adding

<SeekBar
    ....
    android:splitTrack="false" 
/>
Alon
  • 883
  • 1
  • 6
  • 18
Andrew Mackenzie
  • 5,477
  • 5
  • 48
  • 70
  • 12
    Good answer! But be careful - getThumb() is for Jelly Bean(16)+ devices. For previous versions use something like: setThumb(bHide ? getResources().getDrawable(R.color.transparent) : getResources() .getDrawable(R.drawable.player_seekbar_handle)); – goRGon Feb 19 '15 at 19:22
  • 1
    And for `getDrawable(int)` is deprecated, you might want to write something like `setThumb(ContextCompat.getDrawable(context, bHide ? R.color.transparent : R.drawable.player_seekbar_handle));` – RestInPeace Jan 16 '16 at 01:39
  • 2
    For API level more than 21 you should have a look at this answer: [link](http://stackoverflow.com/a/27540406) – TomCobo Feb 16 '16 at 14:55
  • For me this leaves a white gap over the background drawable. Seems like the thumb has a non transparent container view or? – Jensie May 10 '17 at 17:12
  • 1
    U can try this :android:splitTrack="false",and for detail :https://stackoverflow.com/questions/41693154/custom-seekbar-thumb-size-color-and-background – BertKing Apr 06 '18 at 13:14
10

Hide your thumb in a SeekBar via xml

 android:thumbTint="@color/transparent"

for Example

<SeekBar
android:id="@+id/seekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="false"
android:thumb="@color/gray"
android:thumbTint="@android:color/transparent" />
avianey
  • 5,545
  • 3
  • 37
  • 60
krishnan muthiah pillai
  • 2,711
  • 2
  • 29
  • 35
5

The easiest & simplest way to do it is just add this line in your Seekbar view in its xml

android:thumb="@android:color/transparent"
Nasib
  • 1,173
  • 1
  • 13
  • 23
2

You can hide the seekbar thumb by setting arbitrarily large thumb offset value, which will move the thumb out of view. For example,

mySeekBar.setThumbOffset(10000);    // moves the thumb out of view (to left)

To show the thumb again, set the offset to zero or other conventional value:

mySeekBar.setThumbOffset(0);        // moves the thumb back to view

This approach works in all API levels.

Olli
  • 165
  • 1
  • 5
  • 2
    I *think* this seems hacky...... If the seekbar's max is > 10000, the thumb will begin to show when the seekbar's progress becomes > 10000. It will also begin to appear at the beginning of the seekbar and will seem odd to the user. – dell116 Oct 06 '17 at 16:18
0

Hide your thumb in a SeekBar via xml

   android:thumb="@null"
0

just add this two line of code into your seekbar xml

android:thumbTint="#00D1CEB0"

android:splitTrack="false"

syed zaid
  • 1
  • 2
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Aug 04 '23 at 13:06