How to add Cutsom Switch using IconSwitch Library in android?

In this article, we will learn about how to add Custom Switch in our project. As we know the Switch has only two states ON and OFF. In Custom Switch, we add icons that can be used for different purposes depends upon our requirements. With the help of this library IconSwitch, we can easily add a custom switch and it animates automatically when the user changes the state.

Approach:

  1. Add the support Library in build.gradle file and add dependency in the dependencies section. With the help of this we can directly use the widget in the layout.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    dependencies {         
          implementation 'com.polyak:icon-switch:1.0.0'      
    }         

    chevron_right

    
    

  2. Add the following code in activity_main.xml file. Here we add the custom switch in our layout. In app:isw_icon_left and app:isw_icon_right, we add the icons from drawable for left and right switch respectively.

    activity_main.xml

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout 
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
      
        <com.polyak.iconswitch.IconSwitch
            android:id="@+id/icon_switch"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            app:isw_default_selection="right"
            app:isw_icon_left="@drawable/ic_algorithm"
            app:isw_icon_right="@drawable/ic_online_course"
            app:isw_icon_size="25dp" />
      
    </RelativeLayout>

    chevron_right

    
    

  3. Now add the following code in the MainActivity.java file. Here we add setCheckChangedListener on our switch which will get invoked if the switch is changed. If left switch is turned on then case LEFT is executed and if right switch is turned on then case RIGHT is executed.

    MainActivity.java

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    package org.geeksforgeeks.gfgCustomSwitch;
      
    import android.os.Bundle;
    import android.widget.Toast;
    import androidx.appcompat.app.AppCompatActivity;
    import com.polyak.iconswitch.IconSwitch;
      
    public class MainActivity extends AppCompatActivity {
      
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity);
      
            IconSwitch iconSwitch = findViewById(R.id.icon_switch);
            iconSwitch.setCheckedChangeListener(
                new IconSwitch.CheckedChangeListener() {
                    @Override
                    public void onCheckChanged(IconSwitch.Checked current)
                    {
                        switch (current) {
      
                        case LEFT:
                            Toast.makeText(MainActivity.this,
                                           "Algorithms", Toast.LENGTH_SHORT)
                                .show();
                            break;
      
                        case RIGHT:
                            Toast.makeText(MainActivity.this,
                                           "Courses", Toast.LENGTH_SHORT)
                                .show();
                            break;
                        }
                    }
                });
        }
    }

    chevron_right

    
    

Output:

Attention reader! Don’t stop learning now. Get hold of all the important Java and Collections concepts with the Fundamentals of Java and Java Collections Course at a student-friendly price and become industry ready.




My Personal Notes arrow_drop_up


If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :
Practice Tags :


2


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.