Coordinatorlayout + Floatingactionbutton + Snackbar Of Android Pattern Back Upward Library

Posted on

This instance demonstrate how CoordinatorLayout + FloatingActionButton + Snackbar run together – a FloatingActionButton added equally a tyke of CoordinatorLayout, as well as and hence give-up the ghost that CoordinatorLayout to Snackbar.make() telephone telephone – instead of the snackbar displaying over the floating activeness button, the FloatingActionButton takes payoff of additional callbacks provided past times CoordinatorLayout to automatically motion upward equally the snackbar animates inwards as well as returns to its seat when the snackbar animates out on Android 3.0 as well as higher devices – no extra code required.


layout/activity_main.xml

<android.support.design.widget.CoordinatorLayout     xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     xmlns:app="http://schemas.android.com/apk/res-auto"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:layout_margin="20dp"     android:padding="10dp"     android:id="@+id/coordinatorLayout"     android:background="#000050"     tools:context=".MainActivity">      <RelativeLayout         android:layout_width="match_parent"         android:layout_height="match_parent"         android:layout_margin="20dp"         android:padding="10dp"         android:background="#005000">          <TextView             android:id="@+id/title"             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:autoLink="web"             android:textSize="24dp"             android:layout_alignParentTop="true"             android:text="https://rootandroid.org//"             android:textStyle="bold" />          <TextView             android:id="@+id/textView"             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:textStyle="bold"             android:textSize="30dp"             android:layout_alignParentBottom="true"             android:text="Android FloatingActionButton example" />     </RelativeLayout>      <android.support.design.widget.FloatingActionButton         android:id="@+id/floatingActionButton1"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginBottom="20dp"         android:layout_marginRight="20dp"         android:src="@mipmap/ic_launcher"         app:fabSize="normal"         app:layout_anchor="@id/coordinatorLayout"         app:layout_anchorGravity="bottom|left|end"/>      <android.support.design.widget.FloatingActionButton         android:id="@+id/floatingActionButton2"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_marginBottom="20dp"         android:layout_marginRight="20dp"         android:src="@mipmap/ic_launcher"         app:fabSize="mini"         app:layout_anchor="@id/coordinatorLayout"         app:layout_anchorGravity="bottom|right|end"/>  </android.support.design.widget.CoordinatorLayout>  

com.example.eric.androidfloatingactionbutton.MainActivity.java

package com.example.eric.androidfloatingactionbutton;  import android.support.design.widget.CoordinatorLayout; import android.support.design.widget.FloatingActionButton; import android.support.design.widget.Snackbar; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Toast;  world degree MainActivity extends AppCompatActivity {      FloatingActionButton floatingActionButton1, floatingActionButton2;     CoordinatorLayout coordinatorLayout;      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setContentView(R.layout.activity_main);         coordinatorLayout = (CoordinatorLayout)findViewById(R.id.coordinatorLayout);         floatingActionButton1 =                 (FloatingActionButton)findViewById(R.id.floatingActionButton1);         floatingActionButton2 =                 (FloatingActionButton)findViewById(R.id.floatingActionButton2);          floatingActionButton1.setOnClickListener(new View.OnClickListener(){             @Override             world void onClick(View v) {                  Snackbar snackbar = Snackbar.make(                         coordinatorLayout,                         "Snackbar: floatingActionButton1 (normal) clicked",                         Snackbar.LENGTH_LONG);                  snackbar.setAction("OK", novel View.OnClickListener() {                     @Override                     world void onClick(View v) {                         Toast.makeText(                                 MainActivity.this,                                 "snackbar OK clicked",                                 Toast.LENGTH_LONG).show();                     }                 });                  snackbar.show();             }         });          floatingActionButton2.setOnClickListener(new View.OnClickListener(){             @Override             world void onClick(View v) {                 Snackbar snackbar = Snackbar.make(                         coordinatorLayout,                         "Snackbar: floatingActionButton2 (mini) clicked",                         Snackbar.LENGTH_LONG);                  snackbar.setAction("OK", novel View.OnClickListener() {                     @Override                     world void onClick(View v) {                         Toast.makeText(                                 MainActivity.this,                                 "snackbar OK clicked",                                 Toast.LENGTH_LONG).show();                     }                 });                  snackbar.show();             }         });     }  }  

Android Design Support Library is needed, read “How to Add Android Design Support Library to Android Studio Project“.

Next:
– Set text as well as background color of Snackbar