¿Cómo agregar un interruptor personalizado usando la biblioteca IconSwitch en Android? – Part 1

En este artículo, aprenderemos cómo agregar un interruptor personalizado en nuestro proyecto. Como sabemos, el Switch tiene solo dos estados ON y OFF. En Custom Switch, agregamos íconos que se pueden usar para diferentes propósitos según nuestros requisitos. Con la ayuda de esta biblioteca IconSwitch , podemos agregar fácilmente un interruptor personalizado y se anima automáticamente cuando el usuario cambia el estado.

Acercarse:

1. Agregue la biblioteca de soporte en el archivo build.gradle y agregue la dependencia en la sección de dependencias. Con la ayuda de esto, podemos usar directamente el widget en el diseño.

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

2. Agregue el siguiente código en el archivo activity_main.xml. Aquí agregamos el interruptor personalizado en nuestro diseño. En app:isw_icon_left y app:isw_icon_right , agregamos los íconos de drawable para el interruptor izquierdo y derecho respectivamente.

   actividad_principal.xml

   <?xml version="1.0" encoding="utf-8"?> <RelativeLayout      xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res-auto"     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>

3. Ahora agregue el siguiente código en el archivo MainActivity.java . Aquí agregamos setCheckChangedListener en nuestro interruptor, que se invocará si se cambia el interruptor. Si se enciende el interruptor izquierdo, se ejecuta el caso IZQUIERDO y si se enciende el interruptor derecho, se ejecuta el caso DERECHO .

   MainActivity.java

   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;                     }                 }             });     } }

Producción: