How to Create Android Widgets:Custom Toast

In this topic of “How to Create Android Widgets” we will learn how you can customize a Toast. In our previous posts, we covered RatingBar and SeekBar which were much similar to use.

If you are not clear with the basic concepts of Android, please attend this Android Course.

Are you bored using the same Toast all the time?

This blog will tell you how to create your own Customized Toast. Cool isn’t it. ;)

Using Customized Toast, you can truly redefine the look of the toast. You can even put images in your toast. In the above image next to the text “No Internet Connection”, Its an image placed to make this toast look great. Changing the color, size of the text is very easy. So Let’s begin!

How to create Android Widgets:

Custom Toast :

Create an XML file and drag all the android widgets inside it that you want to display in the Toast.

Important key points :

• The layout id is necessary because it will be used in the activity.
• The width and height of the layout should be set as “match_parent” in order to cover the complete Toast.

Create an  xml file named custom_toast.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/toast_custom" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/custom_textview" >

    <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="4dp" android:contentDescription="@string/android" android:src="@drawable/img2" />

    <TextView android:id="@+id/tvtoast" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingRight="6dp" android:paddingTop="6dp" />

</LinearLayout>

Creating another XML file that sets the appearance of the text view which will be used as background in the above layout. This file should be placed in drawable folder.

Create another xml file named custom_textview.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >

    <solid android:color="#98E8F9" />

    <stroke android:width="1dip" android:color="#4fa5d5" />

    <corners android:radius="4dp" />

</shape>

Within the onCreate() method :

The custom layout that we created is inflated inside this method and using it  we can create our customized Toast.

		// Inflating the layout for the toast
		LayoutInflater inflater = getLayoutInflater();
		View layout = inflater.inflate(R.layout.custom_toast,
				(ViewGroup) findViewById(R.id.toast_custom));

		// Typecasting and finding the view in the inflated layout
		TextView text = (TextView) layout.findViewById(R.id.tvtoast);

		// Setting the text to be displayed in the Toast
		text.setText("No internet connection");

		// Setting the color of the Text to be displayed in the toast
		text.setTextColor(Color.rgb(0, 132, 219));

		// Creating the Toast
		Toast toast = new Toast(getApplicationContext());

		// Setting the position of the Toast to centre
		toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);

		// Setting the duration of the Toast
		toast.setDuration(Toast.LENGTH_LONG);

		// Setting the Inflated Layout to the Toast
		toast.setView(layout);

		// Showing the Toast
		toast.show();

[dl url=”#” class=’eModal eModal-11′ title=”Download Code” desc=”” type=”” align=”” for=”download”]

Got a question for us? Mention them in the comments section and we will get back to you. 

Related Posts:

Android SDK Installation

Start your Android Development Course