Android Material Design Snackbar tutorial

In Android  |  Last Updated on Sun, 08 May 2016

Hello guys , today I am  going to explain  how  to   use   Material  Design  Snackbar  in Android  Application . Snackbar is a way to present the user with information in the form of a panel that appears at the bottom of the screen. Snackbar instances contain a brief text message and an optional action button which will perform a task when tapped by the user. Once, a snackbar  displayed, it will either timeout automatically or can be removed manually by the user via a swiping action. During the appearance of the Snackbar the app will continue to respond to user interactions in the normal manner.  Here  I am giving an example to create  a snack bar .

 
Prerequisites:
 

• JDK 7.0 or above
• Android Studio 2.0

Steps to follow:  
 

1. Create a New Android Studio project name SnackBarExample.
2. Select minimum  API level 2.2 so it will run 100% of Android device that are Active on google Play then click next.
3. Select Blank Activity and your Activity name is SnackBarExampleActivity  click next.
4. Give your layout xml name is  activity_fab_example  and menu xml is menu_snack_bar_example And click finish .
5. Now inside FabExampleActivity  write the following  code

 

public class SnackBarExampleActivity extends AppCompatActivity implements View.OnClickListener{

    //Defining Views
    private Button ShowSnackbar;
    private CoordinatorLayout cLayout;

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

        //Initializing views
        ShowSnackbar = (Button) findViewById(R.id.buttonShowSnackbar);
        cLayout = (CoordinatorLayout) findViewById(R.id.coordinateLayout);

        //Adding onclicklistener to button
        ShowSnackbar.setOnClickListener(this);
    }

    //Method to show the snackbar
    private void showSnackbar(){
        //Creating snackbar
        Snackbar snackbar = Snackbar.make(cLayout,"Simple Snackbar",Snackbar.LENGTH_LONG);

        //Adding action to snackbar
        snackbar.setAction("Show another", new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //Displaying another snackbar when user click the action for first snackbar
                Snackbar s = Snackbar.make(cLayout, "Another Snackbar", Snackbar.LENGTH_LONG);
                s.show();
            }
        });

        //Customizing colors
        snackbar.setActionTextColor(Color.BLUE);
        View view = snackbar.getView();
        TextView textView = (TextView) view.findViewById(android.support.design.R.id.snackbar_text);
        textView.setTextColor(Color.RED);

        //Displaying snackbar
        snackbar.show();
    }

    @Override
    public void onClick(View v) {
        //Calling the method to show snackbar on button click
        showSnackbar();
    }
}

 

and the required xml file is like below
 
activity_fab_example.xml
 

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:id="@+id/coordinateLayout"
android:orientation="vertical"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=" .SnackBarExampleActivity">
<Button
android:id="@+id/buttonShowSnackbar"
android:text="Show Snackbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />

<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="16dp"
android:src="@android:drawable/ic_dialog_email" />

</android.support.design.widget.CoordinatorLayout>