android kotlin - Material chip example

MainActivity.kt

package com.cfsuman.jetpack

import android.content.Context
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*


class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        // Set chip click listener
        chip1.setOnClickListener{
            toast("chip clicked")
        }

        // Set chip checked change listener
        chip2.setOnCheckedChangeListener { view, isChecked ->
            // Handle the toggle.
            if (isChecked){
                toast("chip checked")
            }else{
                toast("chip unchecked")
            }
        }


        // Chip close icon click listener
        chip2.setOnCloseIconClickListener{
            toast("chip close icon clicked")
        }
    }
}

// Toast extension method
fun Context.toast(message:String)=
        Toast.makeText(this,message,Toast.LENGTH_SHORT).show()

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/rootLayout"
        tools:context=".MainActivity"
        android:background="#fdfdfc">
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/chip1"
            android:text="Simple Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="8dp"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/chip2"
            android:text="Entry Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip1"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="8dp"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp"
            style="@style/Widget.MaterialComponents.Chip.Entry"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            android:id="@+id/chip3"
            android:text="Icon Entry Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip2"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            style="@style/Widget.MaterialComponents.Chip.Entry"
            app:chipIcon="@drawable/ic_action_rowing"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/chip4"
            android:text="Filter Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip3"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="8dp"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp"
            style="@style/Widget.MaterialComponents.Chip.Filter"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            android:id="@+id/chip5"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip4"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:text="Icon Close Filter Chip"
            style="@style/Widget.MaterialComponents.Chip.Filter"
            app:chipIcon="@drawable/ic_action_android"
            app:closeIconEnabled="true"
            app:chipIconEnabled="true"
            app:checkedIconEnabled="false"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            android:id="@+id/chip6"
            android:text="Choice Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip5"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            style="@style/Widget.MaterialComponents.Chip.Choice"
    />
    <com.google.android.material.chip.Chip
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/chip7"
            android:text="Action Chip"
            android:layout_marginTop="8dp"
            app:layout_constraintTop_toBottomOf="@+id/chip6"
            app:layout_constraintStart_toStartOf="parent"
            android:layout_marginStart="8dp"
            app:layout_constraintEnd_toEndOf="parent"
            android:layout_marginEnd="8dp"
            style="@style/Widget.MaterialComponents.Chip.Action"
    />
</androidx.constraintlayout.widget.ConstraintLayout>

res/values/styles.xml

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>

gradle dependencies

// Material components theme
implementation 'com.google.android.material:material:1.0.0'