SnakBar – Material Design : Android Design Support Library

In previous blog I have written about the FAB(Floating Action Button) If you Didn’t read it than you should read it.

If you are developer, than I can tell you that you already know about the word “Toast” but now in material design concept they have all new component which is called snakbar. As you know in the toast component  you can just display brief message, in that message you can not implement any action callback and if you wants to do that you have to suffer from very lengthy and irritating proccess and coding.

But now google has very new and kind of easy to use component in material Design’s android support library which is known as the Snakbar. We can see Snakbar as a replacement of the toast because now we have a perfect opportunity to use snakbar is to show brief message with quick feedback and light weight.

If we wants to define snak bar that I can tell you that snakbar is one of the component of design support library, and by using that snakbar we can show a quick message at the bottom( in most cases) of the screen. It’s very similar to toast message , but I can surely tell you that it is very flexible with this new extra features which are listed bellow:

Key feature Of Snakbar:

trong>Light weight and quick feedback
  • Brief message at bottom of the screen
  • It automatically disappears after a time out or after user interaction on the screen.
  • It can contain an action, which is optional.
  • Only one snackbar can be displayed at a time.
  • It is a context sensitive message and so those messages are part of the UI screen and appears above all other elements on the screen, not like Toast message overlying on a screen.
  • It can be customized by different style.
  • Add Android design support library dependency

    compile ‘com.android.support:design:23.0.0’

    Note one thing never ever forget to specify android design support  library in gradle file as a dependency in android studio before going to use any material design component including snakbar.for impolementing snakbar you just follow the given syntax.

    Syn

    Syntax Of SnakBar:

    >Snackbar.make(view, message, duration) .setAction(action message, click listener) .show();

    Methods of SnakBar:

    • make()– to imitate the snakbar with custom message
    • setAction()– To set an action on user interaction
    • show()– To show a Snackbar on screen

    Optional

    Optional Methods Of SnakBar:

    tps:/developer.android.com/reference/android/support/design/widget/Snackbar.html#dismiss%28%29">dismiss() – to dismiss the snackbar
  • getDuration() –return the duration of snackbar
  • isShown()-Return whether this Snackbar is currently being shown.
  • setDuration(int duration) – to set duration
  • setText(CharSequencemessage) –  to set the text
  • setActionTextColor(int color) – to set  the text color of the action specified in setAction
  • Attributes Of SnakBar:

    Attributes Of SnakBar:

    the first parameter of make() method. Snack bar follows view hierarchy. So it need parent view to hold. So this attribute provide parent view(which is window decor’s content view or coordinatorLayout) for snackbar.

    Duration – to specify duration.it may be LENGTH_SHORT or LENGTH_LONG as Toast have.

    Example Of SnakBar:Example Of SnakBar:

    nackBar!", Snackbar.LENGTH_LONG) .setAction("Undo", new View.OnClickListener() { @Override public void onClick(View v) { // Perform anything for the action selected } }).show();

    Or

    Snackbar snalbar = Snackbar.make(rootlayout, "I am SnackBar!", Snackbar.LENGTH_LONG);</code>
    
    snalbar.setAction("Undo Action", new View.OnClickListener() {
    @Override
    public void onClick(View v) {
    // Perform anything for the action selected
    }
    })
    snalbar. setActionTextColor(Color.GREEN); // set action text color
    View parentView = snackbar.getView();
    TextView textView = (TextView) parentView.findViewById(android.support.design.R.id.snackbar_text);
    textView.setTextColor(Color.WHITE);
    snalbar .show();

    Selecting Cordinatelayout as parentview of snackbar enable extra featutres like wipe-to-dismiss and automatically moving of widgets like FloatingActionButton.

    In this part, we have talked about Snackbar I hope you have enjoyed and learned bit of the material design’s concept snakbar, which is same as the TOAST message but a bit more flexible with some extra feature which make it stylist. And in the next chapter of this series we are going to see the new concept of material design which is called Floating Action Button.