dev90
dev90

Reputation: 7569

Switch stops displaying after adding Thumb/Track drawables

I added switch, I wanted to change its color, so i added following in drawables.

Thumb.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@color/black" />
    <item android:state_pressed="true"  android:drawable="@color/tabAccessoryButtonSelected" />
    <item android:state_checked="true"  android:drawable="@color/tabAccessoryButtonSelected" />

</selector>

Track.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true"  android:drawable="@color/tabAccessoryButtonSelected" />

</selector>

Layout.xml

<Switch
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:id="@+id/switch1"
    android:layout_centerHorizontal="true"
    android:paddingTop="50dp"
    android:text="@string/notification_settings"
    android:textColor="@color/white"
    android:thumb="@drawable/thumb"
    android:track="@drawable/track"
    />

As soon as i added this, switch has stopped displaying in the layout, the text is still there, but the Switch tool is not there.

If i remove Thumb.xml and Track.xml it starts displaying switch.

Kindly guide me what i am doing wrong here.

Thanks

Upvotes: 0

Views: 134

Answers (2)

Gijs Stokman
Gijs Stokman

Reputation: 173

I know this is an old question but I had the same problem today and the issue seemed to be that the thumb drawable needs a fixed size. The track size seems to adjust itself to the size of the thumb so a thumb with no indicated size won't display and because of this the track won't display either.

If you add an actual xml drawable as a thumb and not just a color you can add a size element to it:

switch_thumb.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">

    <solid android:color="@color/colorSwitchThumb" />

    <corners android:radius="@dimen/switch_corner_radius"/>

    <size android:height="10dp" android:width="10dp"/>

</shape>

Upvotes: 1

Harshad Pansuriya
Harshad Pansuriya

Reputation: 20970

I have modify it now try my solution below.

Layout.xml

<Switch
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:id="@+id/switch1"
    android:layout_centerHorizontal="true"
    android:paddingTop="50dp"
    android:text="@string/notification_settings"
    android:textColor="@color/white"
    android:thumb="@drawable/thumb"
    android:track="@drawable/track"
    />

track.xml

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_focused="true"  android:drawable="@drawable/color_thumb" />  
        <item                               android:drawable="@drawable/gray_track" />  
    </selector>

thumb.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:drawable="@drawable/gray_track" />
    <item android:state_pressed="true"  android:drawable="@drawable/color_thumb" />
    <item android:state_checked="true"  android:drawable="@drawable/color_thumb" />
    <item                               android:drawable="@drawable/gray_track" />
</selector>

color_thumb.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <size android:height="40dp"  />
    <gradient android:height="40dp" android:startColor="@color/tabAccessoryButtonSelected"" android:endColor="@color/tabAccessoryButtonSelected""/>
</shape>

gray_track.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <size android:height="40dp"  />
    <gradient android:height="40dp" android:startColor="@color/tabAccessoryButtonSelected" android:endColor="@color/tabAccessoryButtonSelected"/>
</shape>

Upvotes: 1

Related Questions