Android SnackbBar with Material design example tutorial using Android Studio

How to add setAction(“Undo”, new View.OnClickListener()) on snackbar inside text in android application using design support library.

Android Snackbar is one of the most latest widget comes with Android lollipop mostly used as the place of Toast message with swipe up and down gesture effect. Snackbar can hold only one line of text including one text button ” Undo “. SnackBar automatically displays on screen at the bottom side of it. So here is the complete step by step tutorial for Android SnackbBar with Material design example tutorial using Android Studio.

android-project-download-code-button

Note :  Please follow the below steps very carefully in order to implement SnackBar in your android application :

1. Open your project’s build.gradle ( Module : app ) file.

build-gradle-app

2. Please add below code inside your build.gradle ( Module : app ) file.

compile 'com.android.support:appcompat-v7:23.4.0'
compile 'com.android.support:design:23.2.+'

3. Screenshot of build.gradle ( Module : app ) file after adding above code.

android-support-design

Here your go friends….Now We are going start coding.

Android SnackbBar with Material design example tutorial using Android Studio.

Code for MainActivity.java file.

package com.android_examples.snackbar_android_examplescom;
import android.graphics.Color;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    Button button;
    CoordinatorLayout coordinatorlayout;
    Snackbar snackbar;
    View snackbarView;
    TextView textview;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        button = (Button)findViewById(R.id.button1);

        coordinatorlayout = (CoordinatorLayout)findViewById(R.id.coordinatorlayout);

        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                CreateSnackbar();

            }
        });
    }

    public void CreateSnackbar(){

        snackbar = Snackbar.make(coordinatorlayout, "Simple SnackBar View Text", Snackbar.LENGTH_LONG);

        snackbar.setAction("Undo", new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                Toast.makeText(MainActivity.this, "SnackBar Hide", Toast.LENGTH_LONG).show();

            }
        });

        snackbar.setActionTextColor(Color.parseColor("#76FF03"));

        snackbarView = snackbar.getView();

        snackbarView.setBackgroundColor(Color.parseColor("#009688"));

        snackbar.show();

    }

}

Code for activity_main.xml layout file.

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/coordinatorlayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <RelativeLayout
        android:id="@+id/relativelayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin">


        <Button
            android:id="@+id/button1"
            android:text="Click here to show the SnackBar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </RelativeLayout>

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

Code for colors.xml file.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#009688</color>
    <color name="colorPrimaryDark">#00695C</color>
    <color name="colorAccent">#FF4081</color>
</resources>

Screenshots:

snackbar-1

 

Android SnackbBar with Material design example tutorial using Android Studio

Click here to download Android SnackbBar with Material design example tutorial using Android Studio project with source code.

Leave a Reply

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