How to create custom Toast in android?

If you customize a toast in android then, you can show images instead of displaying some simple text. In this post, We will see how you can create a custom toast in android.

(I am assuming that you know about the Toast in android. In case you don’t know, then click here to read one of my previous posts on Toast in android.)

How to create custom toast in android?

I will create a simple app that contains a button. The button shows a toast when clicked.

Below is the activity_main.xml file that contains a button with text ‘show toast’.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:gravity="bottom|center"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/button"
        android:layout_width="160dp"
        android:layout_height="82dp"
        android:layout_marginBottom="80dp"
        android:text="Show Toast" />
</LinearLayout>

Now, to customize the toast I will create an XML file for the custom toast layout in the layout directory. Below is the custom_toast.xml file that contains an ImageView and a textView inside the ConstraintLayout.

<?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/layout_custom_toast"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="178dp"
        android:layout_height="189dp"
        android:src="@drawable/logo"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.456"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.328" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="227dp"
        android:layout_height="81dp"
        android:gravity="center_horizontal"
        android:text="DeveloperXon"
        android:textColor="#039BE5"
        android:textSize="30sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.581"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView" />
</androidx.constraintlayout.widget.ConstraintLayout>

Now, all I have to do is to inflate this layout, give it to the toast object and show the toast on button click. Let’s see the MainActivity.java file.

package com.example.custom_toast;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = findViewById(R.id.button);

        //Inflate the custom_toast layout
        View myCustomToastLayout = getLayoutInflater().inflate(R.layout.custom_toast, findViewById(R.id.layout_custom_toast));

        //Create the Toast instance
        Toast toast = new Toast(this);
        //Set the layout (myCustomToastLayout) to show as a toast
        toast.setView(myCustomToastLayout);
        toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);
        toast.setDuration(Toast.LENGTH_SHORT);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                toast.show();
            }
        });
    }
}

Output :

Output before tapping on the Show Toast button

Output after tapping on the Show Toast button

That’s all about creating a custom toast in android.

Goodbye.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: