What is a snackbar in android? How to create a snackbar?

Hey, what’s up, guys. In this post, we will talk about Snackbar in android. Snackbar provides a way of displaying short messages to the user. Now you might think, we could do the same with toast also. But a snackbar is more than the toast. So, read this post till the end and you will soon know about snackbar and how it differs from a toast message.

(Here’s a link to my previous post about Toast in android in case you don’t know about toast – What is Toast and how to create Toast in android?)

What is Snackbar in android?

A snackbar provides a way of displaying short messages to the user. Snackbar appears at the bottom of the screen on mobile and lower left on larger devices.

A Snackbar differs from a toast message because you can make a snackbar interactive by adding some actions but this is not the case with a toast message.

If you want the snackbar to work in the best way then display it inside a coordinator layout.

Here’s an official note :

Snackbars work best if they are displayed inside of a CoordinatorLayout. CoordinatorLayout allows the snackbar to enable behavior like swipe-to-dismiss, as well as automatically moving widgets like FloatingActionButton.

Now let’s see how we can create a snackbar.

We call the snackbar.make() method to create a snackbar. We pass three parameters to this method. The first parameter is a view that will hold the snackbar, the second parameter is a text(message) that you want to display to the user and the third parameter is a duration to display the snackbar for.

We add action to the snackbar by calling its setAction() method.

Now let’s see an example.

I will create a simple app to demonstrate the snackbar.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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:id="@+id/coordinator_layout"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Show Snackbar"
        android:textAllCaps="false"
        android:textSize="18sp" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

MainActivity.java

package com.example.snackbarexample;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;

import androidx.appcompat.app.AppCompatActivity;
import androidx.coordinatorlayout.widget.CoordinatorLayout;

import com.google.android.material.snackbar.Snackbar;

public class MainActivity extends AppCompatActivity {

    Button button;
    CoordinatorLayout coordinatorLayout;

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

        button = findViewById(R.id.button);
        coordinatorLayout = findViewById(R.id.coordinator_layout);

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

                        // Call the Snackbar.make() method to Create a snackbar
                        Snackbar snackbar = Snackbar.make(coordinatorLayout, "Action performed", Snackbar.LENGTH_LONG);

                        snackbar.setAction("UNDO",

                                        //We are showing a new message using
                                       // another snackbar when the undo
                                      // button get pressed. This time the snackbar
                                     // contains no any action button.
                                        new View.OnClickListener() {
                                            @Override
                                            public void onClick(View view)
                                            {
                                                Snackbar.make(coordinatorLayout, "Action undone", Snackbar.LENGTH_LONG).show();
                                            }
                                        });

                        snackbar.show();
                    }
                });
    }
}

Output :

Output After pressing the show snackbar button.

Snackbar with action button.

Output After pressing undo button.

Snackbar without action button

That’s all about snackbar in android.

Goodbye.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: