Customize theme's colors

Last example show how to Apply Material Theme (with default color) to Activity. The video show how to further custom the theme colors.


Edit values/styles.xml to modify style of "AppTheme2", adding various color defination.

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="AppTheme2" parent="android:Theme.Material">
        <item name="android:colorPrimary">@android:color/holo_orange_light</item>
        <item name="android:colorPrimaryDark">@android:color/holo_orange_dark</item>
        <item name="android:textColorPrimary">@android:color/holo_blue_bright</item>
        <item name="android:windowBackground">@android:color/darker_gray</item>
        <item name="android:navigationBarColor">@android:color/holo_green_dark</item>
    </style>

</resources>

Make sure "@style/AppTheme2" is used in AndroidManifest.xml.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.blogspot.android_er.androidmultiwindow">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme2">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Reference:
- Using the Material Theme

Apply Material Theme to Activity

This video show how to apply Android provided Material Theme to your Activity.


- Edit values/styles.xml to add a new style inherits from Android provided Material Theme: android:Theme.Material, android:Theme.Material.Light or android:Theme.Material.Light.DarkActionBar.

- Edit AndroidManifest.xml to use the new style.

- You have to change your MainActivity extends Activity. Otherwise the following error will happen:
You need to use a Theme.AppCompat theme (or descendant) with this activity.

The video also show how it display on Multi-Window Mode.

---

Next:
- Customize theme's colors

elevation effect of overlapped view

This example show how elevation effect of overlapped view.

package com.blogspot.android_er.androidzelevation;

import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
import android.widget.SeekBar;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    SeekBar seekBarZ1, seekBarZ2;
    ImageView image1;
    TextView text2;

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

        seekBarZ1 = (SeekBar)findViewById(R.id.z1);
        seekBarZ2 = (SeekBar)findViewById(R.id.z2);
        image1 = (ImageView)findViewById(R.id.image1);
        text2 = (TextView)findViewById(R.id.text2);

        seekBarZ1.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int i, boolean b) {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    image1.setZ(i);
                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {}

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {}
        });

        seekBarZ2.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int i, boolean b) {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    text2.setZ(i);
                    text2.setText("elevation: " + String.valueOf(i) + "px");
                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {}

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {}
        });
    }
}

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    tools:context="com.blogspot.android_er.androidzelevation.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:layout_gravity="center_horizontal"
        android:autoLink="web"
        android:text="http://android-er.blogspot.com/"
        android:textStyle="bold"/>

    <SeekBar
        android:id="@+id/z1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:progress="10"
        android:max="50"/>
    <SeekBar
        android:id="@+id/z2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:progress="5"
        android:max="50"/>

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:id="@+id/image1"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:elevation="10px"
            android:background="#90F0F0F0"
            android:src="@mipmap/ic_launcher"/>
        <TextView
            android:id="@+id/text2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:elevation="5px"
            android:textSize="40dp"
            android:background="#90F0F0F0"
            android:text="elevation: 5px"/>
    </FrameLayout>

</LinearLayout>

Change elevation at run-time, by calling setZ()

This example show how to change elevation of ImageView programmatically, by calling setZ().

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    tools:context="com.blogspot.android_er.androidzelevation.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:layout_gravity="center_horizontal"
        android:autoLink="web"
        android:text="http://android-er.blogspot.com/"
        android:textStyle="bold"/>

    <SeekBar
        android:id="@+id/z"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:progress="20"
        android:max="100"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:gravity="center">
        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:elevation="20dp"
            android:background="@android:color/background_dark"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

</LinearLayout>

package com.blogspot.android_er.androidzelevation;

import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.ImageView;
import android.widget.SeekBar;

public class MainActivity extends AppCompatActivity {

    SeekBar seekBarZ;
    ImageView image;

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

        seekBarZ = (SeekBar)findViewById(R.id.z);
        image = (ImageView)findViewById(R.id.image);
        
        seekBarZ.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
            @Override
            public void onProgressChanged(SeekBar seekBar, int i, boolean b) {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    image.setZ(i);
                }
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar) {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar) {

            }
        });
    }
}

more:
- elevation effect of overlapped view

Example of applying android:elevation on ImageView

Example to apply android:elevation on ImageView.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    tools:context="com.blogspot.android_er.androidzelevation.MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:layout_gravity="center_horizontal"
        android:autoLink="web"
        android:text="http://android-er.blogspot.com/"
        android:textStyle="bold"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:gravity="center">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:elevation="20dp"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:gravity="center">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:elevation="20dp"
            android:background="@android:color/background_dark"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:gravity="center">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:elevation="20dp"
            android:background="#FF0000"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

</LinearLayout>

Running on ASUS Zenfone 2 running Android 5.0

How it shown on Emulator running Android API 23 and API 19, and also Android Studio Design View:

BottomSheetDialog example

The former post show a example of "Implement BottomSheet of Android Design Support Library". This post show a BottomSheetDialog example.


To use Design Support Library in your app, you have to "Add Android Design Support Library to Android Studio Project", currently version 'com.android.support:design:23.4.0'.

Create a file layout/bottomsheetdialog_layout.xml, to define the layout of the BottomSheetDialog.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:text="Bottom Sheet Dialog Example"
            android:textSize="26dp"
            android:textStyle="bold"/>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/ic_launcher"/>

    </LinearLayout>
</LinearLayout>

layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp"
    android:orientation="vertical"
    tools:context="com.blogspot.android_er.androidbottomsheetdialog.MainActivity">

    <LinearLayout
        android:id="@+id/backgroundlayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:autoLink="web"
            android:text="http://android-er.blogspot.com/"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/textSDK"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/prompt1"
            android:textSize="28dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/prompt2"
            android:textSize="28dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </LinearLayout>
</LinearLayout>

MainActivity.java

package com.blogspot.android_er.androidbottomsheetdialog;

import android.content.DialogInterface;
import android.os.Build;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.BottomSheetBehavior;
import android.support.design.widget.BottomSheetDialog;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    LinearLayout backgroundLayout;
    View bottomSheetView;
    TextView textPrompt1, textPrompt2;
    TextView textSDK;

    BottomSheetDialog bottomSheetDialog;
    BottomSheetBehavior bottomSheetBehavior;

    int sdk_int = Build.VERSION.SDK_INT;

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

        textSDK = (TextView)findViewById(R.id.textSDK);
        textSDK.setText("Running SDK_INT: " + sdk_int);

        textPrompt1 = (TextView)findViewById(R.id.prompt1);
        textPrompt2 = (TextView)findViewById(R.id.prompt2);
        backgroundLayout = (LinearLayout)findViewById(R.id.backgroundlayout);

        bottomSheetView = getLayoutInflater().inflate(R.layout.bottomsheetdialog_layout, null);
        bottomSheetDialog = new BottomSheetDialog(MainActivity.this);
        bottomSheetDialog.setContentView(bottomSheetView);
        bottomSheetBehavior = BottomSheetBehavior.from((View) bottomSheetView.getParent());
        bottomSheetBehavior.setBottomSheetCallback(bottomSheetCallback);

        bottomSheetDialog.setOnShowListener(new DialogInterface.OnShowListener() {
            @Override
            public void onShow(DialogInterface dialog) {
                textPrompt1.setText("OnShow");
            }
        });

        bottomSheetDialog.setOnDismissListener(new DialogInterface.OnDismissListener() {
            @Override
            public void onDismiss(DialogInterface dialog) {
                bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
                textPrompt1.setText("OnDismiss");
            }
        });

        backgroundLayout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
                bottomSheetDialog.show();
            }
        });

    }

    BottomSheetBehavior.BottomSheetCallback bottomSheetCallback =
            new BottomSheetBehavior.BottomSheetCallback(){
                @Override
                public void onStateChanged(@NonNull View bottomSheet, int newState) {
                    switch (newState){
                        case BottomSheetBehavior.STATE_COLLAPSED:
                            textPrompt2.setText("COLLAPSED");
                            break;
                        case BottomSheetBehavior.STATE_DRAGGING:
                            textPrompt2.setText("DRAGGING");
                            break;
                        case BottomSheetBehavior.STATE_EXPANDED:
                            textPrompt2.setText("EXPANDED");
                            break;
                        case BottomSheetBehavior.STATE_HIDDEN:
                            textPrompt2.setText("HIDDEN");
                            bottomSheetDialog.dismiss();
                            break;
                        case BottomSheetBehavior.STATE_SETTLING:
                            textPrompt2.setText("SETTLING");
                            break;
                        default:
                            textPrompt2.setText("unknown...");
                    }
                }

                @Override
                public void onSlide(@NonNull View bottomSheet, float slideOffset) {

                }
            };
}

---

~ More example of using Android Design Support Library, Snackbar, FloatingActionButton.

Sets the height of collapsed bottom sheet, by calling setPeekHeight() method

In lasp example of BottomSheet, I implement a OnClickListener of background to expand and collapse the bottom sheet. Without this, user cannot expand the bottom sheet if collapsed, because bottom sheet have height of 0 by default. If you want you can set the height of collapsed bottom sheet, by calling setPeekHeight() method.

This video show how:

MainActivity.java

package com.blogspot.android_er.androidbottomsheet;

import android.os.Build;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.BottomSheetBehavior;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    LinearLayout backgroundLayout;
    View bottomSheet;
    private BottomSheetBehavior bottomSheetBehavior;
    TextView textPrompt;
    TextView textSDK;

    /*
    Build.VERSION.SDK_INT:
    The user-visible SDK version of the framework;
    its possible values are defined in Build.VERSION_CODES.
    https://developer.android.com/reference/android/os/Build.VERSION_CODES.html
     */
    int sdk_int = Build.VERSION.SDK_INT;

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

        textSDK = (TextView)findViewById(R.id.textSDK);
        textSDK.setText("Running SDK_INT: " + sdk_int);

        textPrompt = (TextView)findViewById(R.id.prompt);
        backgroundLayout = (LinearLayout)findViewById(R.id.backgroundlayout);

        bottomSheet = findViewById(R.id.bottomsheet);
        bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);
        bottomSheetBehavior.setBottomSheetCallback(bottomSheetCallback);

        bottomSheetBehavior.setPeekHeight(150);

        /*
        backgroundLayout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (bottomSheetBehavior.getState()){
                    case BottomSheetBehavior.STATE_COLLAPSED:
                        bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
                        break;
                    case BottomSheetBehavior.STATE_EXPANDED:
                        bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
                        break;
                }
            }
        });
        */
    }

    BottomSheetBehavior.BottomSheetCallback bottomSheetCallback =
            new BottomSheetBehavior.BottomSheetCallback(){
        @Override
        public void onStateChanged(@NonNull View bottomSheet, int newState) {
            switch (newState){
                case BottomSheetBehavior.STATE_COLLAPSED:
                    textPrompt.setText("COLLAPSED");
                    break;
                case BottomSheetBehavior.STATE_DRAGGING:
                    textPrompt.setText("DRAGGING");
                    break;
                case BottomSheetBehavior.STATE_EXPANDED:
                    textPrompt.setText("EXPANDED");
                    break;
                case BottomSheetBehavior.STATE_HIDDEN:
                    textPrompt.setText("HIDDEN");
                    break;
                case BottomSheetBehavior.STATE_SETTLING:
                    textPrompt.setText("SETTLING");
                    break;
                default:
                    textPrompt.setText("unknown...");
            }
        }

        @Override
        public void onSlide(@NonNull View bottomSheet, float slideOffset) {

        }
    };
}

Implement BottomSheet of Android Design Support Library

BottomSheet run on API 19

BottomSheet run on API 23

With the help from the Android Design Support Library, you can implement a number of important material design components to all developers and to all Android 2.1 or higher devices.

This example show how to implement Bottom Sheets with help of Android Design Support Library.




To use Design Support Library in your app, you have to "Add Android Design Support Library to Android Studio Project", currently version 'com.android.support:design:23.4.0'.

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.blogspot.android_er.androidbottomsheet.MainActivity">

    <LinearLayout
        android:id="@+id/backgroundlayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:autoLink="web"
            android:text="http://android-er.blogspot.com/"
            android:textStyle="bold" />
        <TextView
            android:id="@+id/textSDK"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/prompt"
            android:textSize="28dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />
    </LinearLayout>

    <android.support.v4.widget.NestedScrollView
        android:id="@+id/bottomsheet"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clipToPadding="true"
        android:background="@android:color/darker_gray"
        app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:text="Bottom Sheet Example"
                android:textSize="26dp"
                android:textStyle="bold"/>
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"/>
        </LinearLayout>

    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

MainActivity.java

package com.blogspot.android_er.androidbottomsheet;

import android.os.Build;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.BottomSheetBehavior;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    LinearLayout backgroundLayout;
    View bottomSheet;
    private BottomSheetBehavior bottomSheetBehavior;
    TextView textPrompt;
    TextView textSDK;

    /*
    Build.VERSION.SDK_INT:
    The user-visible SDK version of the framework;
    its possible values are defined in Build.VERSION_CODES.
    https://developer.android.com/reference/android/os/Build.VERSION_CODES.html
     */
    int sdk_int = Build.VERSION.SDK_INT;

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

        textSDK = (TextView)findViewById(R.id.textSDK);
        textSDK.setText("Running SDK_INT: " + sdk_int);

        textPrompt = (TextView)findViewById(R.id.prompt);
        backgroundLayout = (LinearLayout)findViewById(R.id.backgroundlayout);

        bottomSheet = findViewById(R.id.bottomsheet);
        bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);
        bottomSheetBehavior.setBottomSheetCallback(bottomSheetCallback);

        backgroundLayout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (bottomSheetBehavior.getState()){
                    case BottomSheetBehavior.STATE_COLLAPSED:
                        bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
                        break;
                    case BottomSheetBehavior.STATE_EXPANDED:
                        bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
                        break;
                }
            }
        });

    }

    BottomSheetBehavior.BottomSheetCallback bottomSheetCallback =
            new BottomSheetBehavior.BottomSheetCallback(){
        @Override
        public void onStateChanged(@NonNull View bottomSheet, int newState) {
            switch (newState){
                case BottomSheetBehavior.STATE_COLLAPSED:
                    textPrompt.setText("COLLAPSED");
                    break;
                case BottomSheetBehavior.STATE_DRAGGING:
                    textPrompt.setText("DRAGGING");
                    break;
                case BottomSheetBehavior.STATE_EXPANDED:
                    textPrompt.setText("EXPANDED");
                    break;
                case BottomSheetBehavior.STATE_HIDDEN:
                    textPrompt.setText("HIDDEN");
                    break;
                case BottomSheetBehavior.STATE_SETTLING:
                    textPrompt.setText("SETTLING");
                    break;
                default:
                    textPrompt.setText("unknown...");
            }
        }

        @Override
        public void onSlide(@NonNull View bottomSheet, float slideOffset) {

        }
    };
}

(reference: http://android-developers.blogspot.hk/2016/02/android-support-library-232.html)

Next:
- Sets the height of collapsed bottom sheet, by calling setPeekHeight() method
- BottomSheetDialog example

---

~ More example of using Android Design Support Library, Snackbar, FloatingActionButton.

Learning Material Design

Learning Material Design

Key Features

• Master the highly acclaimed Material Design paradigm and give your apps and pages the look that everyone is talking about
• Get a mix of key theoretical concepts combined with enough practical examples to put each theory into practice so you can create elegant material interfaces with Android Studio and Polymer
• Written by Kyle Mew, successful author with over a decade of mobile and web development experience, this book has both the touch of a developer as well as an experienced writer

Book Description
Google's Material Design language has taken the web development and design worlds by storm. Now available on many more platforms than Android, Material Design uses color, light, and movements to not only generate beautiful interfaces, but to provide intuitive navigation for the user.

Learning Material Design will teach you the fundamental theories of Material Design using code samples to put these theories into practice.

Focusing primarily on Android Studio, you'll create mobile interfaces using the most widely used and powerful material components, such as sliding drawers and floating action buttons. Each section will introduce the relevant Java classes and APIs required to implement these components. With the rules regarding structure, layout, iconography, and typography covered, we then move into animation and transition, possibly Material Design's most powerful concept, allowing complex hierarchies to be displayed simply and stylishly.

With all the basic technologies and concepts mastered, the book concludes by showing you how these skills can be applied to other platforms, in particular web apps, using the powerful Polymer library.

What you will learn

• Implement Material Design on both mobile and web platforms that work on older handsets and browsers
• Design stylish layouts with the Material Theme
• Create and manage cards, lists, and grids
• Design and implement sliding drawers for seamless navigation
• Coordinate components to work together
• Animate widgets and create transitions and animation program flow
• Use Polymer to bring Material Design to your web pages

About the Author
Kyle Mew has been programming since the early eighties and has written for several technology websites. He has also written three radio plays and two other books on Android development.

Table of Contents

• Getting Started with Material Design
• Building a Mobile Layout
• Common Components
• Sliding Drawers and Navigation
• Lists, Cards, and Data
• Animations and Transitions
• Material on Other Devices
• Material Web Frameworks
• The Materialize Framework
• Material Design Lite