Custom Toast in Android

In this article, we learn how to create a Custom Toast.
 

Toast

 
A Toast provides simple feedback in a small popup about an operation. It only fills the amount of space required for the message and the current activity remains visible and interactive.
 
Custom-Toast-in-Android.jpg
 
The need for Custom Toast
 
But what if you want to display your custom view in a Toast? Such as shown in the image above, only text is displayed, no other views are attached to it. It displayed at the bottom of the screen, but what if I want to display it in
 
the center or the top of the screen?
 
Each of the preceding questions has an answer. Let's have a look.
 
Tutorial: Custom Toast
 
In this tutorial, we will learn how to create and how to use a custom toast in our application. We will create an application that displays a toast message such as "Success" and "Failure" messages.
 
Step 1
 
Create a new Android project called "CustomToastDemo" with the following properties:
 
Project Build Target: Android 2.2 or higher
Package Name: com.test
Activity Name: CustomToastDemoActivity
 
Step 2
 
Now, we need to create a custom toast layout file. So create one layout file and name it "custom_toast.xml" and paste the following code into it:
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.    android:orientation="horizontal"  
  4.    android:layout_width="match_parent"  
  5.    android:background="#DDAAAAAA"  
  6.    android:layout_height="match_parent"  
  7.    android:padding="10dp"  
  8.    android:gravity="center_vertical">  
  9.    <ImageView  
  10.       android:id="@+id/imgCustomToast"          android:layout_width="wrap_content"  
  11.       android:layout_height="match_parent"  
  12.       android:src="@drawable/success"  
  13.       android:layout_marginRight="20dp" />  
  14.    <TextView  
  15.       android:id="@+id/txtCustomToast"          android:layout_width="wrap_content"  
  16.       android:layout_height="match_parent"  
  17.       android:text="C# Corner"  
  18.       android:gravity="center_vertical" />  
  19. </LinearLayout> 
But this code will give you an error at "drawable/success". So what you need to do is to download 2 files shown here.
 
Failure Icon: Failure-Icon.jpg
 
Success Icon: Success-Icon.jpg
 
Download them and put then in the "drawable" directory as shown in the following figure:
 
drawable-directory.jpg
 
If you see the graphical output of the current layout then it will look as in the following:
 
graphical-output-of-current-layout.jpg
 
Step 3
 
Create a package called "com.custom" in your "src" directory.
 
Create a Java file called "CustomToast" in the "com.custom" package.
 
After completing the process above, paste the following code into the "CustomToast.java" file:
  1. package com.custom;  
  2.    
  3. import android.app.Activity;  
  4. import android.content.Context;  
  5. import android.view.Gravity;  
  6. import android.view.LayoutInflater;  
  7. import android.view.View;  
  8. import android.widget.ImageView;  
  9. import android.widget.TextView;  
  10. import android.widget.Toast;  
  11.    
  12. import com.test.R;  
  13.    
  14. /** 
  15.  * Custom Toast class extends Toast class to customize it 
  16.  * 
  17.  * @author R 
  18.  * 
  19.  */  
  20. public class CustomToast extends Toast {  
  21.    
  22.       public CustomToast(Context context) {  
  23.             super(context);  
  24.       }  
  25.    
  26.       /** 
  27.        * Custom Toast Cuontructor 
  28.        * 
  29.        * @param context 
  30.        *            : Required to pass to super constructor 
  31.        * @param activity 
  32.        *            : Require to create custom layout inflater and to inflat 
  33.        *            layout 
  34.        * @param message 
  35.        *            : Message to be shown in Toast 
  36.        * @param flag 
  37.        *            : <br> 
  38.        *            True : Success Image<br> 
  39.        *            False: Failure ImageF 
  40.        */  
  41.       public CustomToast(Context context, Activity activity, String message,  
  42.                   boolean flag) {  
  43.             super(context);  
  44.    
  45.             /** 
  46.              * Create a LayoutInflater to inflate layout, here activity is useful 
  47.              */  
  48.             LayoutInflater inflater = activity.getLayoutInflater();  
  49.    
  50.             /** 
  51.              * Create a view of layout which is used to show as toast 
  52.              */  
  53.             View view = inflater.inflate(R.layout.custom_toast, null);  
  54.    
  55.             /** 
  56.              * get id of image view which is defined in layout file 
  57.              */  
  58.             ImageView img = (ImageView) view.findViewById(R.id.imgCustomToast);  
  59.    
  60.             /** 
  61.              * get id of text view which is defined in layout file 
  62.              */  
  63.             TextView txt = (TextView) view.findViewById(R.id.txtCustomToast);  
  64.    
  65.             /** 
  66.              * Check whether flag is true or false and do operation 
  67.              */  
  68.    
  69.             if (flag)  
  70.                   img.setImageResource(R.drawable.success);  
  71.             else  
  72.                   img.setImageResource(R.drawable.fail);  
  73.    
  74.             /** 
  75.              * Set message to text view 
  76.              */  
  77.             txt.setText(message);  
  78.    
  79.             /** 
  80.              * Set gravity of Toast, you can set as per your need. Currently set to 
  81.              * "CENTER" of the screen 
  82.              */  
  83.             setGravity(Gravity.CENTER, 00);  
  84.    
  85.             /** 
  86.              * Pass how long toast will shown to the screen 
  87.              */  
  88.             setDuration(Toast.LENGTH_LONG);  
  89.    
  90.             /** 
  91.              * This is main code to set custom view to Toast 
  92.              */  
  93.             setView(view);  
  94.       }  
  95.    
Step 4
 
You have finished all the steps necessary to create a custom view. Now, it's time to implement that custom toast view for the real world.
 
You have your "CustomToastDemoActivity" file. Open it and paste the following code:
  1. package com.test;  
  2.    
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5.    
  6. public class CustomToastDemoActivity extends Activity {  
  7.       /** Called when the activity is first created. */  
  8.       @Override  
  9.       public void onCreate(Bundle savedInstanceState) {  
  10.             super.onCreate(savedInstanceState);  
  11.             setContentView(R.layout.main);  
  12.    
  13.             new com.custom.CustomToast(thisthis,  
  14.                         "Congratulations!! You are C# Member"true).show();  
  15.              
  16.             new com.custom.CustomToast(thisthis,  
  17.                         ":-( You are not C# Member..."false).show();  
  18.              
  19.       }  
Step 5
 
Bingo.....!!! Run your application and you will see the following output:
 
Output-Custom-Toast-in-Android.jpg
 
1Output-Custom-Toast-in-Android.jpg
 

Summary

 
In this tutorial, we learn how to use Toast as per our needs and extend the use of Toast.


Similar Articles