Custom seekbar thumb not transparent on Lollipop API21

Question

This is my seekbar:

<SeekBar
    android:id="@+id/seek1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    android:progressDrawable="@drawable/style_progressbar"
    android:thumb="@drawable/style_progressbar_circle"
    android:progress="20" />

This is style_progressbar.xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape android:shape="rectangle" >
            <corners android:radius="5dp" />
            <gradient
                android:angle="270"
                android:endColor="@color/gris_hint"
                android:startColor="@color/gris_hint" />
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape android:shape="rectangle" >
                <corners android:radius="5dp" />
                <gradient
                    android:angle="270"
                    android:endColor="@color/gris"
                    android:startColor="@color/gris" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape android:shape="rectangle" >
                <corners android:radius="5dp" />
                <gradient
                    android:angle="270"
                    android:endColor="@color/gris"
                    android:startColor="@color/gris" />
            </shape>
        </clip>
    </item>
</layer-list>

And this is style_progressbar_circle.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/red_scrubber_control_disabled_holo" android:state_enabled="false"/>
    <item android:drawable="@drawable/red_scrubber_control_pressed_holo" android:state_pressed="true"/>
    <item android:drawable="@drawable/red_scrubber_control_focused_holo" android:state_selected="true"/>
    <item android:drawable="@drawable/red_scrubber_control_normal_holo"/>
</selector>

This is how I see it in Lollipop

Seekbar Lollipop

This is how it should look, this is how it looks on Kitkat and lower versions.

Seekbar KitKat

Any idea? I've got some issues with layouts on Lollipop but this is the only one I can't solve for my own.

I have similar issue. I've created android bug report https://code.google.com/p/android/issues/detail?id=79885 — Eugen Martynov, Nov 18 '14 at 18:00

score 62 · Accepted Answer · answered Nov 18 '14 at 18:04

62

The Material seek bar has split track enabled by default. You need to turn it off.

<SeekBar
    ....
    android:splitTrack="false" />

answered Nov 18 '14 at 18:04

alanv

23,966
4
93
80

2

Works like charm. Thanks. Material buttons have textAllCaps enabled by default too, the same issue. – deimian86 Nov 19 '14 at 07:41
7

Small tip. To override hold thumb material effect, it enough to reset background : android:background="@null" – Sergey Vakulenko Nov 20 '14 at 16:39
@SergeyVakulenko awesome! Thank you very much! – Alex Zaitsev Jun 11 '15 at 07:44
1

get a warning that this is only used in API 21 and higher, any solution for lower versions? – CularBytes Jul 03 '15 at 09:16
1

@RageCompex On lower versions it's default value is false – srka Jul 13 '15 at 14:03
For some reason the thumb background is drawn behind the progress bar. Does anyone know why ? – vovahost Jul 22 '16 at 09:06

score 1 · Answer 2 · answered Sep 23 '18 at 08:15

1

use android.support.v7.widget.AppCompatSeekBar and app:splitTrack for all device.

  <android.support.v7.widget.AppCompatSeekBar
      app:splitTrack="false"
      android:splitTrack="false"/>

answered Sep 23 '18 at 08:15

Rasoul Miri

11,234
1
68
78

1

Declaring the `android` tag outside a v21 layout or API 21 project warns of incompatibility and using the `app` tag does not seem to work alone. Have you experienced this issue? – Abandoned Cart Jun 02 '19 at 16:47

Custom seekbar thumb not transparent on Lollipop API21

2 Answers2

Linked