How to Integrate Google Sign In into your Android Application
Probably every app needs login and signup. Sometimes we need to collect very few data from the user. The user gets tired of entering this common information again and again in every app. To overcome these issues google provided login using google account. Google account contains verity of information like name, email id etc. By integrating Google sign in users information can be collected with a single click. This article will demonstrate how to integrate Google Sign In into your android application.
DOWNLOAD SOURCE CODE
DEMO
How to Integrate Google Sign In
While integrating google sign in first of all we need to add/update google play services. Skip this step if you already have latest Google Play services SDK.
1. Adding/Updating Google Play Services
Open SDK manager in Android Studio File -> Setting -> Appearance & Behavior -> System Setting -> Android SDK. Check Google Play services and click Apply to add/update. Following image will give furthermore information.
2. Generating google-services.json file
Create a new project or open existing File-> New Project. Enter the basic information of project and create it. Since connecting to Google services never been easy. Follow following steps to generate google-services.json file. This file has to be added to app folder of Android Studio project.
2.1 while Generating google-services.json file we need SHA-1 fingerprint. Go to View -> Tools Window -> Gradle. In Gradle panel go to Project name -> app -> Tasks -> android. Double click signingReport. Gradle Task will run.
2.2 Iside run panel report will generate. Toggle report to text using toggle button shown in the image below.
2.3 Now you can see SHA-1 fingerprint as shown in the image below. Copy SHA-1 fingerprint.
2.4 Go to Google’s quick start guide click on GET CONFIGURATION FILE button.
2.5 Enter app name and Package name of the application.
2.6 Choose service as Google Sign-in. Enter SHA-1 fingerprint click on enable as shown in the image below.
2.7 Click Download google-services.json configuration file.
3. Adding google-services.json file to Android Studio Project
3.1 Move google-services.json file Project Root -> App folder as shown in the image below.
3.2 There are two build.gradle files. One is app level and another one is a project level build.gradle file as shown in the following image.
Add the dependency to your project-level build.gradle. Below is an example.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
// Top-level build file where you can add configuration options common to all sub-projects/modules. buildscript { repositories { google() jcenter() } dependencies { classpath 'com.android.tools.build:gradle:3.0.0' /*Add dependency here */ classpath 'com.google.gms:google-services:3.1.0' } } allprojects { repositories { google() jcenter() } } task clean(type: Delete) { delete rootProject.buildDir } |
Open app level build.gradle file. Apply google services plugin at the bottom of the file. Add dependency to google play service auth library. There is one more library used here Picasso it is completely optional. We will use Picasso to load user profile picture.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
apply plugin: 'com.android.application' android { compileSdkVersion 26 defaultConfig { applicationId "com.loopwiki.googlesignin" minSdkVersion 15 targetSdkVersion 26 versionCode 1 versionName "1.0" testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro' } } } dependencies { implementation fileTree(dir: 'libs', include: ['*.jar']) implementation 'com.android.support:appcompat-v7:26.1.0' implementation 'com.android.support.constraint:constraint-layout:1.0.2' implementation 'com.android.support:design:26.1.0' /*add Google Play services Auth library here*/ implementation 'com.google.android.gms:play-services-auth:11.6.0' /*Optional Add Piccasso library dependecy here to load profile Picture */ implementation 'com.squareup.picasso:picasso:2.5.2' } /*Add Apply Plugin here */ apply plugin: 'com.google.gms.google-services' |
3.3 Copy and paste below string resource in your Values -> strings.xml file.
|
1 2 3 4 5 6 |
<resources> <string name="app_name">Google Sign In</string> <string name="action_settings">Settings</string> <string name="logged_in">Successfully Logged in with email</string> <string name="logged_out">Please Login using following button</string> </resources> |
4. Creating Activity
4.1 Create new layout -> content_main.xml. Add Textview for name And email. ImageView for displaying profile picture of the user. Two buttons for one for google sign in and another for logout.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
<?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" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:context="com.loopwiki.googlesignin.MainActivity" tools:showIn="@layout/activity_main"> <!-- Profile layout--> <LinearLayout android:layout_marginTop="32dp" android:id="@+id/llProfileLayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <ImageView android:id="@+id/imageViewProfilePic" android:layout_width="84dp" android:layout_height="84dp" android:layout_gravity="center_horizontal" android:layout_marginTop="8dp" /> <TextView android:textAppearance="@style/TextAppearance.AppCompat.Large" android:id="@+id/textViewPersonName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="4dp" /> <TextView android:textAppearance="@style/TextAppearance.AppCompat.Medium" android:id="@+id/textViewEmail" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="4dp" /> </LinearLayout> <!--Google Sign In button--> <com.google.android.gms.common.SignInButton android:id="@+id/sign_in_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="8dp" /> <!--Logout button--> <Button android:id="@+id/buttonLogout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" android:layout_marginTop="8dp" android:text="Logout" android:visibility="gone" /> </LinearLayout> |
4.2 Create new layout -> activity_main.xml. This layout contains toolbar and content_main.xml.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.loopwiki.googlesignin.MainActivity"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:popupTheme="@style/AppTheme.PopupOverlay" /> </android.support.design.widget.AppBarLayout> <include layout="@layout/content_main" /> </android.support.design.widget.CoordinatorLayout> |
4.3 Create new class Package Name -> MainActivity.java. Add following code to it.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 |
public class MainActivity extends AppCompatActivity { //Google sign in api Client GoogleSignInClient mGoogleSignInClient; //Define Request code for Sign In private int RC_SIGN_IN = 6; TextView textViewEmail; TextView textViewPersonName; ImageView imageViewProfilePic; LinearLayout llProfileLayout; //Logout Button declaration Button buttonLogout; //Sign in button Declaration SignInButton signInButton; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //Bind views Toolbar toolbar = findViewById(R.id.toolbar); textViewEmail = findViewById(R.id.textViewEmail); textViewPersonName = findViewById(R.id.textViewPersonName); imageViewProfilePic = findViewById(R.id.imageViewProfilePic); llProfileLayout = findViewById(R.id.llProfileLayout); signInButton = findViewById(R.id.sign_in_button); buttonLogout = findViewById(R.id.buttonLogout); setSupportActionBar(toolbar); //Build Google Sign in options GoogleSignInOptions gso = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN) .requestEmail() .build(); //get Sign in client mGoogleSignInClient = GoogleSignIn.getClient(this, gso); //get currently signed in user returns null if there is no logged in user GoogleSignInAccount account = GoogleSignIn.getLastSignedInAccount(this); //update ui updateUI(account); } //Method to signIn private void signIn() { Intent signInIntent = mGoogleSignInClient.getSignInIntent(); startActivityForResult(signInIntent, RC_SIGN_IN); } //method to sign out private void signOut() { mGoogleSignInClient.signOut() .addOnCompleteListener(this, new OnCompleteListener<Void>() { @Override public void onComplete(@NonNull Task<Void> task) { if (task.isSuccessful()) { updateUI(null); } } }); } //Handle sign in results private void handleSignInResult(Task<GoogleSignInAccount> completedTask) { try { GoogleSignInAccount account = completedTask.getResult(ApiException.class); // Signed in successfully, show authenticated UI. updateUI(account); } catch (ApiException e) { // The ApiException status code indicates the detailed failure reason. // Please refer to the GoogleSignInStatusCodes class reference for more information. updateUI(null); } } private void updateUI(GoogleSignInAccount account) { //Account is not null then user is logged in if (account != null) { buttonLogout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { signOut(); } }); signInButton.setVisibility(View.GONE); buttonLogout.setVisibility(View.VISIBLE); textViewEmail.setText(account.getEmail()); textViewPersonName.setText(account.getDisplayName()); Picasso.with(this).load(account.getPhotoUrl()).fit().into(imageViewProfilePic); llProfileLayout.setVisibility(View.VISIBLE); } else { //user is not logged in // Set the dimensions of the sign-in button. signInButton.setSize(SignInButton.SIZE_WIDE); signInButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { signIn(); } }); signInButton.setVisibility(View.VISIBLE); buttonLogout.setVisibility(View.GONE); llProfileLayout.setVisibility(View.GONE); } } @Override public void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); // Result returned from launching the Intent from GoogleSignInClient.getSignInIntent(...); if (requestCode == RC_SIGN_IN) { // The Task returned from this call is always completed, no need to attach // a listener. Task<GoogleSignInAccount> task = GoogleSignIn.getSignedInAccountFromIntent(data); handleSignInResult(task); } } } |
Breaking MainActivity
These lines are used to build GoogleSignInOptions.
|
1 2 3 4 5 |
GoogleSignInOptions gso = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN) .requestEmail() .build(); //get Sign in client mGoogleSignInClient = GoogleSignIn.getClient(this, gso); |
Check user is already logged in or not and update UI.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
//get currently signed in user returns null if there is no logged in user GoogleSignInAccount account = GoogleSignIn.getLastSignedInAccount(this); //update ui updateUI(account); private void updateUI(GoogleSignInAccount account) { //Account is not null then user is logged in if (account != null) { buttonLogout.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { signOut(); } }); signInButton.setVisibility(View.GONE); buttonLogout.setVisibility(View.VISIBLE); textViewEmail.setText(account.getEmail()); textViewPersonName.setText(account.getDisplayName()); Picasso.with(this).load(account.getPhotoUrl()).fit().into(imageViewProfilePic); llProfileLayout.setVisibility(View.VISIBLE); } else { //user is not logged in // Set the dimensions of the sign-in button. signInButton.setSize(SignInButton.SIZE_WIDE); signInButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { signIn(); } }); signInButton.setVisibility(View.VISIBLE); buttonLogout.setVisibility(View.GONE); llProfileLayout.setVisibility(View.GONE); } } |
Method to sign in, sign out the user.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
//Method to signIn private void signIn() { Intent signInIntent = mGoogleSignInClient.getSignInIntent(); startActivityForResult(signInIntent, RC_SIGN_IN); } //method to sign out private void signOut() { mGoogleSignInClient.signOut() .addOnCompleteListener(this, new OnCompleteListener<Void>() { @Override public void onComplete(@NonNull Task<Void> task) { if (task.isSuccessful()) { updateUI(null); } } }); } |
Now when user will login using google account we will get a sign in result inside onActivityResult() method. Inside this method, we will check for request code and send the result to handleSignInResult() method.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@Override public void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); // Result returned from launching the Intent from GoogleSignInClient.getSignInIntent(...); if (requestCode == RC_SIGN_IN) { // The Task returned from this call is always completed, no need to attach // a listener. Task<GoogleSignInAccount> task = GoogleSignIn.getSignedInAccountFromIntent(data); handleSignInResult(task); } } |
Inside handle, result get the user account and update UI.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
//Handle sign in results private void handleSignInResult(Task<GoogleSignInAccount> completedTask) { try { GoogleSignInAccount account = completedTask.getResult(ApiException.class); // Signed in successfully, show authenticated UI. updateUI(account); } catch (ApiException e) { // The ApiException status code indicates the detailed failure reason. // Please refer to the GoogleSignInStatusCodes class reference for more information. updateUI(null); } } |
5. Run the application
Most of the emulators do not have Google Play Services installed on it. Now in Android Studio, some emulators have Google Play Services added install emulators which have play services icon shown in the image below.
If it won’t work you can run it on a real device.
6. Output
If you still have any queries, please post them in the comments section below, I will be happy to help you. If you have any other questions in mind then make sure to visit our ask section.
