How to Use GlassActionBar Library in Android App?

GlassActionBar is an Android library that adds a glassy look to the action bar. It makes the view behind the action bar translucent, giving it a beautiful aesthetic. It also works with the three most popular action bar implementations: stock (API 11+), ActionBarCompat, and ActionBarSherlock. In this article, we will use the Java programming language to integrate this library into an Android app. A sample GIF is provided below to give you an idea of what we will do in this article.

Step by Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add the library dependency

Navigate to the Gradle Scripts > build.gradle(Module:app), add the library in the dependencies section, and sync the project.

dependencies {
      implementation 'com.github.manuelpeinado.glassactionbar:glassactionbar:0.3.0'
}

Step 3: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and refer to the following code. Below is the code for the activity_main.xml file. 

XML

<com.cyrilmottier.android.translucentactionbar.NotifyingScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--This layout contains the main layout below action bar-->
    <!--This LinearLayout contains children in vertical order-->

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

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:scaleType="centerCrop"
            android:src="@drawable/gfgicon" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#fff"
            android:padding="15dp"
            android:text="@string/gfg"
            android:textAppearance="@android:style/TextAppearance.Medium" />

    </LinearLayout>

</com.cyrilmottier.android.translucentactionbar.NotifyingScrollView>

Step 4: Working with the styles.xml file

Navigate to the app > res > values> styles.xml and refer to the following code. Below is the code for the styles.xml file. 

XML

<resources>

    <!--Adding background for GlassActionBar-->
    <style name="TranslucentActionBar" parent="android:Widget.ActionBar">
        <item name="android:background">@drawable/ab_transparent</item>
    </style>

</resources>

Step 5: Working with the themes.xml file

• Navigate to the app > res > values
• Right-click on values and select New > Values Resource File
• A dialog box will appear now, then add the File Name as themes and press OK.
• Below is the code for the themes.xml file.

XML

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="android:Theme.Holo.Light">
    </style>

    <!--Adding translucent theme for glassy effect -->
    <style name="AppTheme.TranslucentActionBar">
        <item name="android:windowActionBarOverlay">true</item>
        <item name="android:actionBarStyle">@style/TranslucentActionBar</item>
    </style>

</resources>

Step 6: Working with the AndroidManifest.xml file

Navigate to app > manifests > AndroidManifests.xml  and add Translucent Theme for action bar in the activity. 

android:theme="@style/AppTheme.TranslucentActionBar" 

Step 7: Working with the MainActivity.java file

Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. 

Java

import android.app.Activity;
import android.os.Bundle;

import com.manuelpeinado.glassactionbar.GlassActionBarHelper;

public class MainActivity extends Activity {
    private GlassActionBarHelper helper;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // Adding glass action bar view to the activity
        helper = new GlassActionBarHelper().contentLayout(R.layout.activity_main);
        setContentView(helper.createView(this));
    }
}

Output: 

Github Repository for the following project can be found here.