Custom Toast message in Android

June 12, 2012
By

In our previous article titled A Simple Toast Message, we have seen how to create a simple toast message. In this article we are going to see how to customize the toast messages so that the look and feel of toast messages can be modified.


1. Create an Android project

New Android Project

Figure 1 : New Android Project


2. Select build target

Select API Level

Figure 2: Selecting the Build target


3. Enter application details

Application Details

Figure 3 : Application Details


4. Open and update the file /res/values/strings.xml with two new strings namely “lblBtnClickMe” and “iconDescription”. See the highlighted code given below:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="hello">Hello World, MainActivity!</string>
    <string name="app_name">CustomToastMessage</string>
    <string name="lblBtnClickMe">Click Me !!!</string>
    <string name="iconDescription">Icon for the toast message</string>
</resources>

5. Open the file /res/layout/main.xml and modify it with the given below code :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/btnClickMe"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/lblBtnClickMe" />

</LinearLayout>


6. Create a new Android XML file named toast_layout.xml in /res/layout/ directory

Toast Layout

Figure 4: Toast Layout


7. Update the file /res/layout/toast_layout.xml with the given below code :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

<ImageView
    android:id="@+id/icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:contentDescription="@string/iconDescription"
/>

<TextView
    android:id="@+id/msg"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
/>

</LinearLayout>

8. Open the file /src/in/wptrafficanalyzer/customtoast/MainActivity.java and update the file as given below :

package in.wptrafficanalyzer.customtoast;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        // A click listener
        OnClickListener listener = new OnClickListener() {

        @Override
        public void onClick(View v) {
            // Getting the main view group
            ViewGroup viewGroup = (ViewGroup) findViewById(R.layout.main);

            // Creating a view object inflated by the layout toast_layout
            View view = View.inflate(getBaseContext(), R.layout.toast_layout, viewGroup);

            // Getting the reference to the TextView "msg" of the toast_layout
            TextView txtMessage = (TextView) view.findViewById(R.id.msg);

            // Setting a text for the TextView "msg" of the toast_layout
            txtMessage.setText("Hello Android by custom toast message");

            // Getting the reference to the ImageView "icon" of the toast_layout
            ImageView image = ( ImageView ) view.findViewById(R.id.icon);

            // Setting an image to the ImageView "icon" of the toast_layout
            image.setImageResource(R.drawable.ic_launcher);

            // Creating  a toast object
            Toast toast = new Toast(getBaseContext());

            // Setting toast object's view
            toast.setView(view);

            // Displaying the toast message
            toast.show();
        }
    };

    // Get a reference to the button btnClickMe of the main activity
    Button btn = (Button) findViewById(R.id.btnClickMe);
    btn.setOnClickListener(listener);

    }
}

9. For running the application in Android Virtual Device, click the menu Run -> Run from the eclipse IDE :

Application in execution

Figure 5 : Application in execution


10. Download the application :


11. Reference

http://developer.android.com/guide/index.html


How to hire me?

I am George Mathew, working as software architect and Android app developer at wptrafficanalyzer.in

You can hire me on hourly basis or on project basis for Android applications development.

For hiring me, please mail your requirements to info@wptrafficanalyzer.in.

My other blogs
store4js.blogspot.com


Android Knowledge Quiz

Ready to test your knowledge in Android? Take this quiz :



Tags: ,

Leave a Reply

Your email address will not be published. Required fields are marked *

Be friend at g+

Subscribe for Lastest Updates

FBFPowered by ®Google Feedburner