How to create this toggle button?

Question

How can I create a toggle button that looks like this?

Currently I have the below:

        <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:layout_weight="1">

        <ToggleButton
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textOff="@string/toggle_button_boy_add_baby"
            android:textOn="toggle_button_boy_add_baby" />

        <ToggleButton
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textOff="@string/toggle_button_girl_add_baby"
            android:textOn="@string/toggle_button_girl_add_baby" />

        <ToggleButton
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:textOff="@string/toggle_button_unsure_add_baby"
            android:textOn="@string/toggle_button_unsure_add_baby" />

    </RadioGroup>

Any tips or advice would be much appreciated. Thank you.

see following git repo https://github.com/hoang8f/android-segmented-control probably help — ρяσѕρєя K, Dec 01 '15 at 12:12
http://stackoverflow.com/questions/20538421/segment-control-in-android — Liuting, Dec 01 '15 at 12:26
this one is pretty easy aswell: https://github.com/nairteashop/SegmentedControl — bofredo, Dec 01 '15 at 13:17

score 2 · Answer 1 · answered Dec 02 '15 at 05:25

try this,

build.gradle

dependencies {
compile 'info.hoang8f:android-segmented:1.0.6'

}

@style/RadioButton

    <attr name="sc_corner_radius" format="dimension" />
<attr name="sc_border_width" format="dimension" />
<attr name="sc_tint_color" format="color" />
<attr name="sc_checked_text_color" format="color" />

code

     <info.hoang8f.android.segmented.SegmentedGroup
        xmlns:segmentedgroup="http://schemas.android.com/apk/res-auto"
        android:id="@+id/segmented2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:orientation="horizontal"
        segmentedgroup:sc_border_width="2dp"
        segmentedgroup:sc_corner_radius="10dp">

        <RadioButton
            android:id="@+id/button21"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="One"
            style="@style/RadioButton" />

        <RadioButton
            android:id="@+id/button22"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Two"
            style="@style/RadioButton" />

        <RadioButton
            android:id="@+id/button24"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Two"
            style="@style/RadioButton" />
    </info.hoang8f.android.segmented.SegmentedGroup>

How to create this toggle button?

1 Answers1

Linked