Why use Snackbar instead of Toasts?

Open Event Android  

Why use Snackbar instead
of Toasts?

January 14, 2019

Problem

Toasts are kind of deprecated as any user who has disabled notifications for an app won't be able to see
toast as well. The Open Event Android App was using toast for displaying information. So the task is
to completely remove toasts and use snackbar instead.

Solution

Why Snackbar?

Snackbars provide lightweight feedback about an operation. They show a brief message
at the bottom of the screen on mobile and lower left on larger devices. Snackbars appear above
all other elements on screen and only one can be displayed at a time.They automatically
disappear after a timeout or after user interaction elsewhere on the screen, particularly after
interactions that summon a new surface or activity. Snackbars can be swiped off screen.

The Difference

Snackbar

Contain a single line of text directly related to the operation performed.
They may contain a text action, but no icons.

• Lightweight feedback about an operation
• Optionally includes a single action
• Can optionally stay on-screen permanently, until swiped off screen

Toast

Primarily used for system messaging. They also display at the bottom of the screen,
but may not be swiped off-screen.

• System-level messaging
• No user action can be performed
• Can only stay on the screen temporarily. could not be swipe

What you have now:

Toast.makeText(Context, String, TimeLength).show()

Or You might have used the Crouton library that is now sadly deprecated. This library has passed
its prime and is now considered deprecated.”

You can call a snackbar like this:

Snackbar.make(Appropriate_View, “Whoo, snackbar!”, Snackbar.LENGTH_LONG).show();

For this you have to add in your build.gradle file:

Implementation  ‘com.android.support:design:22.2.1’

And you can use directly the above example in any AppCompatActivity activity,

meaning your activity should be looking like

public class MainActivity extends AppCompatActivity

Congratulations. :)

But wait there’s more you can do with your snackbar

You can add a button in it:

.setAction("CLOSE", mOnClickListener);

Or you can customize its colors:

In a class (let's call it DUtils.java)

add a function like this

public static void inform(Activity mView, String string, int text_color) {   Snackbar snack = Snackbar.make(mView.findViewById(android.R.id.content), string, Snackbar.LENGTH_LONG);   View view = snack.getView();   TextView tv = (TextView) view.findViewById(android.support.design.R.id.snackbar_text);   tv.setTextColor(mView.getResources().getColor(text_color));   //change background color too ?   view.setBackgroundColor(mView.getResources().getColor(R.color.your_background_color));   snack.show(); } DUtils.inform(mContext, getString(R.string.txt_maximum_number_of_options_reached_message), R.color.text_color_of_your_choice);

And use it with red color for errors, orange alerts, green for success, or any other way you want it.

Result:

To solve the Issue #785  First I have to change all the layouts of activities and fragment to
Coordinator Layout because Ideally, Snackbar works best if your parent layout is a
CoordinatorLayout . This ensures that it plays nice with other UI elements.
So I changed the all the layout file used in the app. Fixed some UI and alignment issue
with some layout’s UI on the way. The PR made doing this process to completely remove the
Toasts and show snackbar instead of them are mentioned below.

ISSUE : #785

PR : #788     Login work

       #809    Signup Work

       #849    Edit Profile

       #864    Attende Fragment

       #879    Events Related Fragments

       #886    Search result and Order result fragment

       #908    Ticket and Favourite fragmnet

Author : Govind Dixit

Tags : Fossasia, Codeheat, Open Event, Android, Kotlin