Android Facebook Login With Examples [Latest]

Android Facebook Login

Many applications use Login With Facebook to register users in their applications. For the login with Facebook to work, we must have a unique ID for our android application which communicates with the Facebook server.

Let’s start with my creating a new empty Android Studio project.

Now before we write any piece of code, we need to register our application as demonstrated below.

Registering Your Facebook Application

Login using your Facebook account to: https://developers.facebook.com/apps/.

Now create a new app. And set the app name and the email id as shown in the below pic.

Note: Facebook doesn’t allow us to set app names which contain the keyword fb/facebook etc. Hence we’d set the app name to TestTutorial. We’ll need to set up the same name in the strings.xml app_id string of our Android Studio Project.

You shall see the dashboard in the next screen. Choose Facebook Login Setup and select the platform as Android as shown in the below images.

From the next screen, instead of downloading the Facebook SDK, import the SDK using the gradle dependency.
For that, add the following dependencies in your app‘s build.gradle.

buildscript {
repositories {
mavenCentral()
}
}

Use the latest version of the SDK dependency.

implementation 'com.facebook.android:facebook-android-sdk:4.31.0'

To check that the sdk is successful added in our project add the following import statements in your MainActivity.java class file as shown below. If there’s no error, the build was successful.

import com.facebook.FacebookSdk;
import com.facebook.appevents.AppEventsLogger;

Add your Facebook App ID
The App ID present in the Facebook developers application dashboard needs to be added in the strings.xml in our Android Studio Project.

<string name="facebook_app_id">894882580618030</string>

Enter your package name and default activity name with the fully qualified path as shown below. After saving click on Use this package name to confirm.

S

The next window asks for the setting up the key hashes. That can be done by running the following commands on mac terminal/windows cmd:

//Mac cmd
keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore | openssl sha1 -binary | openssl base64
//Windows cmd
keytool -exportcert -alias androiddebugkey -keystore "C:UsersUSERNAME.androiddebug.keystore" | "PATH_TO_OPENSSL_LIBRARYbinopenssl" sha1 -binary | "PATH_TO_OPENSSL_LIBRARYbinopenssl" base64

Copy and paste the hash key in the Key hashes field below.
You will need to provide a key hash for every device you run this application on till it is in development mode.

Enable Single Sign-on on the next segment.

Back to Android Studio, add the following line in strings.xml file:

<string name="fb_login_protocol_scheme">fb204127990172423</string>

The number followed by fb is our APP ID above.

Enable internet permissions in the AndroidManifest.xml file by adding the following line in the manifest element.

<uses-permission android:name="android.permission.INTERNET"/>

Now add the following code inside the application tag in the Manifest.

<meta-data android:name="com.facebook.sdk.ApplicationId"
        android:value="@string/facebook_app_id"/>
    <activity android:name="com.facebook.FacebookActivity"
        android:configChanges=
                "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
        android:label="@string/app_name" />
    <activity
        android:name="com.facebook.CustomTabActivity"
        android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="@string/fb_login_protocol_scheme" />
        </intent-filter>
    </activity>

Let’s get onto the business end now that the registration and setup is done.
In the following app we’ll add a login with Facebook button which on click would retrieve and display the user’s name, email and profile picture.
We’ll be seeing how the Facebook SDK does all of this.

Android Facebook Login Project Structure

Android Facebook Integration Code

The code for the activity_main.xml layout file is given below.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#222"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="com.journaldev.loginwithfbexample.MainActivity">
    <ImageView
        android:id="@+id/imageView"
        android:src="https://www.journaldev.com/19718/@mipmap/ic_launcher"
        android:layout_width="100dp"
        android:layout_height="100dp" />
    <TextView
        android:id="@+id/txtUsername"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Username"
        android:padding="8dp"
        android:textColor="#FFF" />
    <TextView
        android:id="@+id/txtEmail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Email Address"
        android:padding="8dp"
        android:textColor="#FFF" />
    <com.facebook.login.widget.LoginButton
        android:id="@+id/login_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingBottom="15dp"
        android:paddingTop="15dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>

We’ve changed our layout to a LinearLayout, to stack the views vertically.

The code for the MainActivity.java class is given below.

package com.journaldev.loginwithfbexample;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.widget.ImageView;
import android.widget.TextView;
import com.facebook.AccessToken;
import com.facebook.CallbackManager;
import com.facebook.FacebookCallback;
import com.facebook.FacebookException;
import com.facebook.GraphRequest;
import com.facebook.GraphResponse;
import com.facebook.Profile;
import com.facebook.login.LoginResult;
import com.facebook.login.widget.LoginButton;
import com.squareup.picasso.Picasso;
import org.json.JSONException;
import org.json.JSONObject;
import java.util.Arrays;
public class MainActivity extends AppCompatActivity {
    LoginButton loginButton;
    CallbackManager callbackManager;
    ImageView imageView;
    TextView txtUsername, txtEmail;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        loginButton = findViewById(R.id.login_button);
        imageView = findViewById(R.id.imageView);
        txtUsername = findViewById(R.id.txtUsername);
        txtEmail = findViewById(R.id.txtEmail);
        boolean loggedOut = AccessToken.getCurrentAccessToken() == null;
        if (!loggedOut) {
            Picasso.with(this).load(Profile.getCurrentProfile().getProfilePictureUri(200, 200)).into(imageView);
            Log.d("TAG", "Username is: " + Profile.getCurrentProfile().getName());
            //Using Graph API
            getUserProfile(AccessToken.getCurrentAccessToken());
        }
        loginButton.setReadPermissions(Arrays.asList("email", "public_profile"));
        callbackManager = CallbackManager.Factory.create();
        loginButton.registerCallback(callbackManager, new FacebookCallback<LoginResult>() {
            @Override
            public void onSuccess(LoginResult loginResult) {
                // App code
                //loginResult.getAccessToken();
                //loginResult.getRecentlyDeniedPermissions()
                //loginResult.getRecentlyGrantedPermissions()
                boolean loggedIn = AccessToken.getCurrentAccessToken() == null;
                Log.d("API123", loggedIn + " ??");
            }
            @Override
            public void onCancel() {
                // App code
            }
            @Override
            public void onError(FacebookException exception) {
                // App code
            }
        });
    }
    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        callbackManager.onActivityResult(requestCode, resultCode, data);
        super.onActivityResult(requestCode, resultCode, data);
    }
    private void getUserProfile(AccessToken currentAccessToken) {
        GraphRequest request = GraphRequest.newMeRequest(
                currentAccessToken, new GraphRequest.GraphJSONObjectCallback() {
                    @Override
                    public void onCompleted(JSONObject object, GraphResponse response) {
                        Log.d("TAG", object.toString());
                        try {
                            String first_name = object.getString("first_name");
                            String last_name = object.getString("last_name");
                            String email = object.getString("email");
                            String id = object.getString("id");
                            String image_url = "https://graph.facebook.com/" + id + "/picture?type=normal";
                            txtUsername.setText("First Name: " + first_name + "nLast Name: " + last_name);
                            txtEmail.setText(email);
                            Picasso.with(MainActivity.this).load(image_url).into(imageView);
                        } catch (JSONException e) {
                            e.printStackTrace();
                        }
                    }
                });
        Bundle parameters = new Bundle();
        parameters.putString("fields", "first_name,last_name,email,id");
        request.setParameters(parameters);
        request.executeAsync();
    }
}

In the above code:

Listening for Changes on LoginButton click
AccessToken Tracker makes it possible to listen for changes on button click.
accessToken2 is the latest access token. accessToken is the older one.

Android Facebook Login App Output

The output of the above application in action is given below.

Note: If you get an error like this:

Add the hash mentioned in your respective screen in the App’s Dashboard on Facebook Developers Page.
You need to add the hash values for all such devices using the login with Facebook in development mode.

Adding More Permissions for Facebook Integration

To add and use more permissions in your application, head on to the app review section on the dashboard in the Facebook developer page. Every new permission must be approved by Facebook first.

This brings an end to this tutorial. You can download the Android LoginWithFbExample Project from the link below. Create your own APP ID and replace it with the one in strings.xml!