title: Default Switch overlapping with Custom Switch
body: <p>I'm trying to implement custom switch using two images for false and true respectively . But the problem is default switch image us overlapping with custom switch images.</p>
  
  <p>Below is my code for Switch:</p>
  
  <pre><code>&lt;Switch
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Do you want the current offer as your final offer"
          android:background="@null"
          android:button="@null"
          android:textOff=""
          android:textOn=""
          android:drawableRight="@drawable/switch"
          android:textSize="16sp"
          android:textColor="#9B9B9B"
          android:id="@+id/switch1"
           /&gt;
  </code></pre>
  
  <p>And the following is my switch.xml </p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;selector xmlns:android="http://schemas.android.com/apk/res/android"&gt;
  
     &lt;item
         android:drawable="@drawable/dummy_toggle_off"
         android:state_checked="false" /&gt;
     &lt;item
         android:drawable="@drawable/dummy_toggle_on"
         android:state_checked="true" /&gt;
     &lt;item
         android:drawable="@drawable/dummy_toggle_off"/&gt;
  
  &lt;/selector&gt;
  </code></pre>
  
  <p>Here are the resulting images :</p>
  
  <p><a href="https://i.stack.imgur.com/5BgTA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5BgTA.png" alt="enter image description here"></a> 
  <a href="https://i.stack.imgur.com/4zJXp.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4zJXp.png" alt="enter image description here"></a></p>