how to add a rounded rectangular toggle_switch in android?

Question

I need to make a rounded rectangular toggle_switch in android like the one given below:

enter image description here

Can anyone guide me the complete steps to do so.

`I have to have '3 lines' on the switch button and a 'tick mark' in place of ON and nothing (blank) in place of 'OFF'` Better if you **show a picture** of what you **exactly** want... — Phantômaxx, Jan 04 '15 at 13:25
You want something like that: http://stackoverflow.com/a/21434374/4224337 ? — Rami, Jan 04 '15 at 13:29
Can you share the approach you used to achieve the goal. The accepted solution is not very helpful. Specifically did you use `image drawable` or `xml drawable`. And what state did you use for track when the switch is ON. — Vinayak Garg, Apr 22 '15 at 11:17
@VinayakGarg ... Just posted the solution.. You can have a look — R.K, Apr 25 '15 at 17:34

score 3 · Accepted Answer · answered Apr 25 '15 at 17:34

I solved my problem as follow :

Added a toggle button to my xml layout file :

<ToggleButton
                android:id="@+id/ToggleButton1"
                android:layout_width="120dp"
                android:layout_height="25dp"
                android:layout_marginRight="30dp"
                android:layout_weight="2"
                android:background="@drawable/toogle_switch"
                android:text="ToggleButton"
                android:textOff=""
                android:textOn="" />

Then defined a custom togglebutton Background "toogle_switch" in 'drawable' folder as below:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/switchon" android:state_checked="true"></item>
    <item android:drawable="@drawable/switchoff" android:state_checked="false"></item>

</selector>

switchon & switchoff are the 2 images I have shown in question.

Hope it helps everyone.! :)

score 0 · Answer 2 · answered Jan 04 '15 at 15:14

Here you go:

http://developer.android.com/guide/topics/ui/controls/togglebutton.html

Exact image shown is determined by so called 'selector' or 'state list', which is a piece of XML that maps button states to images.

http://developer.android.com/guide/topics/resources/drawable-resource.html#StateList

You need to:

prepare images for all possible states of the button (toggled, pressed, etc) and place them in drawable folders
write a state list (selector) that binds images with button states
connect this state list to button android:background property

how to add a rounded rectangular toggle_switch in android?

2 Answers2