Objective
In this tutorial, I am going to explain the stepwise process of Google+ integration to your android app, authenticate user using Google+ and fetch user’s credentials.
Step 1
Introduction
By integrating Google+ in your android app, you can create a simple authentication process where user can directly login to your app using their Google+ credentials. We can also fetch various user information such as user email, name, profile info etc. through this process. Other than authentication process, we can use google+ integration for fetching friend list, sharing content from G+ and posting purposes also.
Step 2
Prerequisites
Requirements for Google Sign-in using Android:
The Android SDK Manager in Android Studio should have latest Android SDK version including the SDK Tools component.
Google Play Services should be installed into the SDK environment at android-sdk-folder/extras/google/google_play_services.
you can check the Google Play Services is installed or not in your Android SDK Manager by using following steps:
open your Android SDK Manager.
select Tools > Android > SDK Manager
Scroll to the bottom of the package list and select Extras > Google Play services it should look like this
Step 3
Google Plus Integration
Step 3.1
Create A Project On Google Developers Console
First of all, You have to create a project in Google Developers Console.
Step 3.1.1
Add Project Name
Add Project Name,Which you want to use for integration with android application.
Step 3.2
Enable Google+ API
To use google+ API services, You need to enable Google+ API on Google Developers Console.
Step 3.2.1
Click On Enable Google+ API
Click on the “Enable and Manage API” or click on the “API Manager” on left side navigation bar to open the API Manager window.
Step 3.2.2
Click On Google+ API
Click on the Google+ API
Step 3.2.3
Click On “Enable API” Button
Click on “Enable API” button.To use google plus services.
Step 3.3
Add Credentials
On the left, click on Credentials ⇒ Add Credentials ⇒ API Key.
Click on API Key ⇒ android key
Step 3.4
Set App Key and Client ID
Step 3.4.1
Set App Key Name
Set your android App key Name and click on “create” button to get the App key.
Step 3.4.2
Set Product Name
Click on “OAuth Constent Screen” and set the Product Name shown to the user.It must be set before creating the client ID.
Step 3.4.3
Create Client ID
Click New credentials, then select OAuth 2.0 client ID.to create your Client ID.
Step 3.4.4
Add Android Project Package Name
Choose android and set android application package name and SHA-1 fingerprint to generate client id.
Step 3.4.5
Generate SHA-1 Fingerprint
To generate SHA-1 fingerprint, type the following command on your system’s Command prompt(CMD).
on MAC and any Linux OS
On Windows
SHA-1 fingerprint would look like this on CMD
Step 3.4.6
Set SHA-1 Fingerprint
5.6) Set the created SHA-1 fingerprint into the Google Developers Console. and create client’s ID.
See the Example Below:
Finally,the credentials look like this
Step 4
Get Configuration File
Generate the configuration file and for this,you have to provide the SHA-1 hash of your signing certificate. and click on the button “Get A Configuration File”.
Follow the screens given below:
Step 4.1
Add Project Created In Google Developer Console and Android Project Name
Add your Project name created in Google Developer Console and package name of your android Application.
Step 4.2
Choose Google Sign-In Service And Add SHA-1 hash fingerprint
Add SHA-1 hash fingerprint to the configuration window and choose the type of service you want to add into your android application
Step 4.3
Generate And Download Configuration File
Click on Close ⇒ Generate Configuration File ⇒ Download google-services.json.
Step 5
Add Configuration File To Android Project
Add the configuration file to your project
Copy the just downloaded file named google-services.json into your android project’s app directory and the Google Services plugin for Gradle parses configuration information from the google-services.json file.
Step 6
Add dependency
Add the dependency to your project-level build.gradle
Add the plugin and declare Google Play Services as a dependency to your app-level build.gradle
Step 7
Add Permissions To Manifest File
7) Add the following permissions into the AndroidManifest.xml file
Step 8
Add Meta-Data To Manifest File
Add meta-data tag under application tag in AndroidManifest.xml file for google play services.
Finally the AndroidManifest.xml file should look like this
Step 9
Google+ Login Process
Step 9.1
Add String Name For Buttons
Add following strings for buttons label by opening strings.xml file under res ⇒ values ⇒ strings.xml.
Step 9.2
Add Google Sign-In Button
Add the following code for google signIn button to your activity_main.xml file.
Step 9.3
Add App Level Dependency For Circular View Of Profile Pic
Add the dependency into to your app-level build.gradle to show the user profile picture in circular manner.
Step 9.4
Add Tag For Circular View Of Profile Pic
Now add the following code to get the user’s profile picture in circular view.
Your activity_main.xml file should look like this.
Step 9.5
Buid New Google Api Client To Use Google+ API
You need to create and initialize GoogleApiClient object to use Google Plus Api.While initializing the GoogleApiClient object, request the Plus.SCOPE_PLUS_LOGIN scope.You need to build the GoogleApiClient two time,when user login for the first time and after revoking the user access by clicking on the disconnect button.
Open your MainActivity.java file and add the following code to it and call this method in onCreate method
Step 9.6
Customize Google sign-In Button
Add the given below method to MainActivity.java file and call it into the onCreate method.This method is used to customize the google sign-in button.A red button may be displayed when Google+ scope “Plus.SCOPE_PLUS_LOGIN” is requested.
Step 9.7
Set onClick Events On Buttons
Add the given below method to MainActivity.java file and call it into the onCreate method.This method is used to set on click Listeners on the sign-in sign-out and disconnect buttons.
Step 9.8
Initiate GoogleApiClient Connection on Activity Start
Add the following line of code to onStart() method to initiate the GoogleApiClient connection on the start of the activity to ensure that request for connection is made.
Step 9.9
Disconnect GoogleApiClient Connection on Activity Stop
On stop activity,If the GoogleApiClient connection is made, you can disconnect it using the GoogleApiClient’s disconnect() function.see below
Step 9.10
Connect GoogleApiClient Connection on Activity Resume
On resume activity,If the GoogleApiClient connection is made,you can connect it using the the GoogleApiClient’s connect() function.see below
Step 9.11
On GoogleApiClient Connected
When the GoogleApiClient connection is established successfully it means you have signed in successfully then the callback function onConnected() is called to made the changes to the UI.
Add the following line of code into the MainActivity.java file to show user profile information after successfully signed in.
Step 9.12
On GoogleApiClient Connection Failure
In case of connection failure,callback method onConnectionFailed() is called to handle and resolve failure and try to establish connection again.
Add the following line of code into the MainActivity.java file to handle failure and try to re-connection again.
Step 9.13
On GoogleApiClient Connection Suspend
On connection suspend,callback method onConnectionSuspended() is called,to again establish connection and make layout changes accordingly.
Add the following line of code into the MainActivity.java file to again establish connection and make layout changes accordingly.
Step 9.14
Sign-In Using Google+ Account
The given below method is used to sign in user using Google+ account. Add this to the MainActivity.java file call it in onClick().
Step 9.15
Resolve Sign-In Error
To resolve sign in error add this method in to the MainActivity.java file.
Step 9.16
Sign-Out From Google+ Account
The method shown below is used to sign out from Google+ account.call this method in onclick().
Step 9.17
Revoking Access From Google+ Account
The method shown below is used to revoke access from Google+ account.call this method in onclick().
Step 9.18
onClick Event Handler
Here is the overridden onClick method to handle the on click events on different buttons ID.
Step 9.19
Change Layout After Sign-In
Add the given below method to MainActivity.java file to show layout according to the user’s login status.
Step 10
Get User profile Information
The given below method is used to fetch the user’s information like name, email Id, profile pic and more. Add this method into the MainActivity.java file and call it into the onConnected() method, which is called after successful login.
Step 11
Set User profile Information
The method mention below is used to set the user’s information into the views defined in the layout.
Step 11.1
Set User Profile Picture With Custom Dimensions
The profile pic url gives 50×50 px image by default.If you need a bigger size image we have to change the query parameter value from 50 to the size you want.To get the new image you have to send an asynchronous request which will run in background to fetch new image and load it into the circular image view.
Here is the class named LoadProfilePic, extends the AsyncTask which is used to perform background operation and publish results on the UI thread.We use this class to get the profile pic with new dimensions and load it into the circular image view by creating its object and calling its execute method.
Add this class to the MainActivity.java file.
Step 12
Final Source Code
Finally, MainActivity.java file should look like this.
Demo Result Screens: