Android Tutorial

Software Setup and Configuration

Android Studio

File Structure

Components

Core Topics

Layout

View

Button

Intent and Intent Filters

Toast

RecyclerView

Fragments

Adapters

Other UI Component

Image Loading Libraries

Date and Time

Material Design

Bars

Working with Google Maps

Chart

Animation

Database

Advance Android

Jetpack

Architecture

App Publish

App Monetization

How to add Custom Switch using IconSwitch Library in android?

The IconSwitch library provides a custom switch for Android which resembles the iOS segmented control. The switch allows the user to select between two options, typically referred to as "checked" and "unchecked" or "on" and "off".

Here's how you can integrate the IconSwitch library and use it in your Android application:

1. Add the Dependency:

First, you need to add the library to your build.gradle (Module: app):

implementation 'com.polyak:icon-switch:1.1.3'

2. Add the IconSwitch to Your Layout:

After syncing your project with the Gradle files, you can add the IconSwitch to your XML layout:

<com.polyak.iconswitch.IconSwitch
    android:id="@+id/icon_switch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:is_checkedIcon="@drawable/your_checked_icon"
    app:is_uncheckedIcon="@drawable/your_unchecked_icon"
    app:is_textChecked="On"
    app:is_textUnchecked="Off"
    app:is_checkedColor="@color/colorPrimary"
    app:is_uncheckedColor="@color/colorSecondary"/>

Replace your_checked_icon and your_unchecked_icon with the drawables you'd like to use for each state. You can also customize other properties, such as text and colors, using the provided attributes.

3. Listen to Switch Changes:

In your activity or fragment, you can set a listener to react to changes in the switch state:

val iconSwitch: IconSwitch = findViewById(R.id.icon_switch)
iconSwitch.setCheckedChangeListener { isChecked ->
    if (isChecked) {
        // Handle checked state
    } else {
        // Handle unchecked state
    }
}

4. Get or Set Switch State:

To get the current state of the switch:

val currentState = iconSwitch.checked

To programmatically set the state:

iconSwitch.checked = true  // for checked
iconSwitch.checked = false // for unchecked

With these steps, you'll be able to use IconSwitch in your Android app to provide an interactive switch with customizable icons and text.

  1. Implementing custom switch with IconSwitch in Android:

    • Description: Integrate the IconSwitch library to create a custom toggle switch with icons.
    • Code:
      <!-- Add the IconSwitch library dependency in your build.gradle file -->
      implementation 'com.github.KeepSafe:IconSwitch:1.0.3'
      
      <!-- Include IconSwitch in your layout file -->
      <com.github.KeepSafe.IconSwitch.IconSwitch
          android:id="@+id/iconSwitch"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:isw_checked="true"
          app:isw_icon="@drawable/ic_custom_icon"
          app:isw_icon_margin="8dp" />
      
  2. Customizing appearance and icons in IconSwitch for Android:

    • Description: Customize the appearance of the IconSwitch, including icons, margins, and other visual aspects.
    • Code:
      <com.github.KeepSafe.IconSwitch.IconSwitch
          android:id="@+id/iconSwitch"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:isw_checked="true"
          app:isw_icon="@drawable/ic_custom_icon"
          app:isw_icon_margin="8dp"
          app:isw_icon_off="@drawable/ic_custom_icon_off"
          app:isw_icon_on="@drawable/ic_custom_icon_on"
          app:isw_background_color="@color/custom_background_color" />
      
  3. Handling state changes and events in IconSwitch:

    • Description: Set up listeners to handle state changes and events triggered by the IconSwitch.
    • Code:
      val iconSwitch = findViewById<IconSwitch>(R.id.iconSwitch)
      iconSwitch.setCheckedChangeListener(object : IconSwitch.CheckedChangeListener {
          override fun onCheckChanged(isChecked: Boolean) {
              // Handle switch state change
          }
      })
      
  4. Adding labels or text to a custom switch using IconSwitch:

    • Description: Enhance the custom switch by adding labels or text to provide context to the user.
    • Code:
      <com.github.KeepSafe.IconSwitch.IconSwitch
          android:id="@+id/iconSwitch"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:isw_checked="true"
          app:isw_icon="@drawable/ic_custom_icon"
          app:isw_icon_margin="8dp"
          app:isw_text="Custom Switch" />