How to change the height of a switch widget?

Question

I want to have my switch widget larger and so I have to change the height of the switch.

But I have no solution to this.

I looked at this question: Change height of switch

And I made a drawable like this:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"  android:width="0dp" android:height="30dp">
    <solid android:color="#FF4444"  />
</shape>

Then I setted my switch like this:

<Switch
android:id="@+id/sw_trackLiveData"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_liveData"
android:layout_alignRight="@+id/btn_stoptrip1"
android:layout_alignLeft="@+id/btn_stoptrip1"
android:layout_marginTop="10dp"
android:thumbTextPadding="25dp"
android:switchMinWidth="56dp" 
android:track="@drawable/roundedbutton"
android:layout_centerHorizontal="true"
android:textSize="20dp" />

But it doesnt work. I do something wrong. Can anyone give me an example how to do right? Or can anyone guide me through this?

score 4 · Accepted Answer · answered Mar 06 '14 at 08:39

4

Change your roundedButton.xml like that:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <size
        android:height="20dp"
        android:width="56dp" />
    <solid android:color="#FF4444" />

</shape>

answered Mar 06 '14 at 08:39

Dadroid

1,444
15
16

I just ran through your example and I was able to recreate your situation. As dato says in his post, the solution is that you have to use the element. The android:height="..." and android:width="..." you used in the element aren't valid attributes for – Quantium May 11 '14 at 20:13

score 4 · Answer 2 · edited Aug 15 '17 at 02:44

Change your switch Selector to below in drawable (custom_selector.xml)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
  <item android:state_checked="true">
    <shape
      android:shape="rectangle"
      android:visible="true"
      android:dither="true"
      android:useLevel="false">
      <gradient
        android:startColor="@color/colorAccent"
        android:endColor="@color/colorAccent"
        android:angle="270"/>
      <corners
        android:radius="20dp"/>
      <size
        android:width="37dp"
        android:height="37dp" />
      <stroke
        android:width="4dp"
        android:color="#0000ffff"/>
    </shape>
  </item>
  <item android:state_checked="false">
    <shape
      android:shape="rectangle"
      android:visible="true"
      android:dither="true"
      android:useLevel="false">
      <gradient
        android:startColor="@android:color/white"
        android:endColor="@android:color/white"
        android:angle="270"/>
      <corners
        android:radius="20dp"/>
      <size
        android:width="37dp"
        android:height="37dp" />
      <stroke
        android:width="4dp"
        android:color="#0000ffff"/>
    </shape>
  </item>
</selector>

and Create Track in drawable (custom_track.xml)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="rectangle"
  android:visible="true"
  android:dither="true"
  android:useLevel="false">
  <gradient
    android:startColor="@color/card_background"
    android:endColor="@color/card_background"
    android:angle="270"/>
  <corners
    android:radius="20dp"/>
  <size
    android:width="50dp"
    android:height="26dp" />
</shape>

And in Xml file :

<Switch
  android:id="@+id/switch"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_centerHorizontal="true"
  android:layout_marginRight="16dp"
  android:textOff="OFF"
  android:scaleX="2"
  android:scaleY="2"
  android:textOn="ON"
  android:thumb="@drawable/customswitchselector"
  android:track="@drawable/custom_track" />

score -1 · Answer 3 · edited Mar 06 '14 at 08:38

-1

just change

android:layout_width="wrap_content"
android:layout_height="wrap_content"

to

 android:layout_width="200dp"
 android:layout_height="100dp"

edited Mar 06 '14 at 08:38

Hamid Shatu

9,664
4
30
41

answered Mar 06 '14 at 08:37

Swagat Mali

66
9

2

I think setting android:layout_width will only affect the width of the text label in front of the switch, not the width of the actual sliding switch. Likewise, setting layout_height adjusts the height of the entire widget, but does not change the height of the sliding switch. – Quantium May 11 '14 at 20:20
The question is referring to the entire widget including the switch graphics, not only the outer container. – Manzotin Sep 26 '19 at 11:28

How to change the height of a switch widget?

3 Answers3