CoordinatorLayout + FloatingActionButton + Snackbar of Android Design Support Library

This example show how CoordinatorLayout + FloatingActionButton + Snackbar work together - a FloatingActionButton added as a child of CoordinatorLayout, and then pass that CoordinatorLayout to Snackbar.make() call - instead of the snackbar displaying over the floating action button, the FloatingActionButton takes advantage of additional callbacks provided by CoordinatorLayout to automatically move upward as the snackbar animates in and returns to its position when the snackbar animates out on Android 3.0 and 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="http://android-er.blogspot.com/"
            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;

public class 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
            public void onClick(View v) {

                Snackbar snackbar = Snackbar.make(
                        coordinatorLayout,
                        "Snackbar: floatingActionButton1 (normal) clicked",
                        Snackbar.LENGTH_LONG);

                snackbar.setAction("OK", new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        Toast.makeText(
                                MainActivity.this,
                                "snackbar OK clicked",
                                Toast.LENGTH_LONG).show();
                    }
                });

                snackbar.show();
            }
        });

        floatingActionButton2.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View v) {
                Snackbar snackbar = Snackbar.make(
                        coordinatorLayout,
                        "Snackbar: floatingActionButton2 (mini) clicked",
                        Snackbar.LENGTH_LONG);

                snackbar.setAction("OK", new View.OnClickListener() {
                    @Override
                    public 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 and background color of Snackbar