Android Kotlin Custom Toast Example

In this post, we will see how to display a custom Toast in Android using Kotlin. Usually, Toast is used to show some text message to the user in a popup. This toast message will be visible for only a few seconds.

To display a normal toast message we write the following code.

 Toast.makeText(applicationContext, "This is a simple Toast!!!", Toast.LENGTH_LONG).show() 

In the above code, the makeText() method takes three parameters namely the application context, text message, and duration.

If we want to display the toast, for a short period of time we set duration as Toast.LENGTH_SHORT, for a long period of time we set duration as Toast.LENGTH_LONG. And the show() method is used to display the toast on the screen.

The default toast will look as shown in the image below.

As shown in the above image default toast consist of only text. But we can also customize a toast message if we want our own custom toast to display.

In the below Android custom toast example. I am going to display a custom toast message which contains an image and a text message.

Android Custom Toast Example – Kotlin

Firstly, I have created a new android project with an empty activity. Added the following code in the activity_main.xml file.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:id="@+id/clParent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <Button
        android:id="@+id/buttonShowToast"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        android:text="Show Custom Toast"
        android:textColor="#FFFFFF"
        android:background="@color/colorPrimary"/>
</androidx.constraintlayout.widget.ConstraintLayout>

I have defined a button labeled “Show Custom Toast”. When this button has clicked a custom toast will be displayed.

Next, I have created a layout resource file named custom_toast.xml which contains XML code for custom toast.

custom_toast.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:id="@+id/llCustomToastContainer"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <ImageView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:src="@drawable/ic_launcher_background"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="This is Custom Toast"
        android:textSize="24sp"/>
</LinearLayout>

MainActivity.kt

package com.example.customtoastexample
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.Gravity
import android.view.LayoutInflater
import android.widget.LinearLayout
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*
import kotlinx.android.synthetic.main.custom_toast.*
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        buttonShowToast.setOnClickListener {
            val customToastLayout = layoutInflater.inflate(R.layout.custom_toast,llCustomToastContainer)
            val customToast = Toast(this)
            customToast.view = customToastLayout
            customToast.setGravity(Gravity.CENTER,0,0)
            customToast.duration = Toast.LENGTH_LONG
            customToast.show()
        }
    }
}

Here in MainActivity.kt, we are creating a toast object and inflating the custom_toast layout to the toast view. setGravity() method is used to position the custom toast to the center of the screen.

When the user clicks the “Show Custom Toast” button, a custom toast will pop up.

Output: