Tuesday, 11 August 2015

Android Snackbar Example


Before going to the example, first we have to know about  CoordinatorLayout and SnackBars


SnackBars

          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.

CoordinatorLayout 
        The main function of a coordinatorlayout is to act as a container and perform specific interactions between child views. Like shifting up of floating action button when an Android snackbar appears.

Step 1)activity_main.xml

<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/mainLayout"
        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">

        <CheckBox
            android:id="@+id/checkBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="40dp"
            android:text="Mark as delete"/>
    </RelativeLayout>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:layout_marginRight="20dp"
        android:src="@drawable/abc_ic_menu_cut_mtrl_alpha"
        app:fabSize="normal"
        app:layout_anchor="@id/coordinatorLayout"
        app:layout_anchorGravity="bottom|right|end"/>
</android.support.design.widget.CoordinatorLayout>


Step 2)Mainactivity.java


package com.as0060.snackbar;
import android.graphics.Color;
import android.os.Bundle;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.TextView;


public class MainActivity extends AppCompatActivity 
    {
    View.OnClickListener mOnClickListener;

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

        final CoordinatorLayout coordinatorLayout = (CoordinatorLayout) 
                                                                        findViewById(R.id .coordinatorLayout);
        final CheckBox checkBox = (CheckBox) findViewById(R.id.checkBox);
        checkBox.setOnCheckedChangeListener
                                                 (new CompoundButton.OnCheckedChangeListener() 
         {
        @Override
        public void onCheckedChanged(CompoundButtonbuttonView,booleanisChecked)  {
                if (isChecked
                  {
                    Snackbar snackbar = Snackbar
                            .make(coordinatorLayout, "I AM DHINA", Snackbar.LENGTH_LONG)
                            .setAction("Undo", mOnClickListener);
                             snackbar.setActionTextColor(Color.RED);
                             View snackbarView = snackbar.getView();
                             snackbarView.setBackgroundColor(Color.DKGRAY);
                             TextView textView = (TextView)snackbarView.findViewById                                                                          (android.support.design.R.id.snackbar_text);
                             textView.setTextColor(Color.YELLOW);
                             snackbar.show();
                }
            }
        });

        mOnClickListener = new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                checkBox.setChecked(false);
            }
        };
    }

}


Step 3)build.gradle(Module:app)


apply plugin: 'com.android.application'

android {
    compileSdkVersion 21
    buildToolsVersion "21.1.2"

    defaultConfig {
        applicationId "com.as0060.snackbar"
        minSdkVersion 15
        targetSdkVersion 21
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:22.1.1'
    compile 'com.android.support:design:22.2.0'

}


Happy Coding:)