Tutorial details

Android beginner tutorial: Part 39 - Custom Toast notifications | App Code for Sale | Preview

Android beginner tutorial: Part 39 - Custom Toast notifications | Android Tutorial

How to create our own custom Toast notifications

Overview PAGE TOP

In this tutorial we will learn how to create our own custom Toast notifications.

The activity_main.xml Activity layout will remain the same as in the previous tutorial:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity" >

<Button
    android:id="@+id/testButton"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Make a toast"
    />

</LinearLayout>

To create a custom Toast, we need to write a layout xml for it. We can then apply it to a Toast using a LayoutInflater.

Create a new layout xml file. If you're using Eclipse IDE, go to File > New > Android XML File. Call the file custom_toast.xml.

Inside the layout I'm going to make a simple LinearLayout container, which contains an ImageView and a TextView. Remember to give the container an id. Set the src of the ImageView to a picture in your project (I set it to the ic_launcher.png picture). Give an id to the TextView.

<?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"
    android:padding="10dp"
    android:background="#333" 
    android:id="@+id/toast_layout" >

    <ImageView android:id="@+id/image"
        android:src="@drawable/ic_launcher"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_marginRight="10dp" />

    <TextView android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:textColor="#FFF" />

</LinearLayout>

Now we need to apply this layout to the Toast notification. As I said before, we'll need to use a LayoutInflater class instance to do that. An inflater can extract layouts from XML files and lets us work with them using code. To extract the layout, we need to declare an inflater and then call its inflate() function. Provide the layout resource and the id of the main container in that layout:

LayoutInflater inflater = getLayoutInflater();
View layout = inflater.inflate(R.layout.custom_toast, (ViewGroup) findViewById(R.id.toast_layout));

Set the text by refering to the "text" TextView inside the layout:

TextView text = (TextView) layout.findViewById(R.id.text);
text.setText("Hello from KirCode!");

The rest of the code simply creates the Toast and sets its values. Use setView() method to apply the layout.

Toast toast = new Toast(getApplicationContext());
toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);
toast.setDuration(Toast.LENGTH_LONG);
toast.setView(layout);
toast.show();

Here is the full MainActivity.java class code:

package com.kircode.codeforfood_test;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity{

private Context context;

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

Button button = (Button)findViewById(R.id.testButton);
context = getApplicationContext();

button.setOnClickListener(new View.OnClickListener() {

@Override
public void onClick(View v) {
LayoutInflater inflater = getLayoutInflater();
View layout = inflater.inflate(R.layout.custom_toast, (ViewGroup) findViewById(R.id.toast_layout));

TextView text = (TextView) layout.findViewById(R.id.text);
text.setText("Hello from KirCode!");

Toast toast = new Toast(getApplicationContext());
toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);
toast.setDuration(Toast.LENGTH_LONG);
toast.setView(layout);
toast.show();
}
});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}

}

The results look like this:

imaf.png

Thanks for reading!

Reference PAGE TOP

http://kirill-poletaev.blogspot.it/2013/01/android-beginner-tutorial-part-39.html

0 Comments Leave a comment

Please login in order to leave a comment.

Newest first
!

Sign-in to your Chupamobile Account.

The Easiest way to Launch your next App or Game.

Join Chupamobile and get instant access to thousands of ready made App and Game Templates.

Creating an account means you’re okay with Chupamobile’s Terms of Service and Privacy Policy.