Skip to content

Firebase Authentication with FirebaseUI (Android)

Many apps require log-in functionality, perhaps to provide users with dedicated data storage. Firebase makes it easy as it can get. You can even use one of Google’s ready-made authentication screens.

And that’s exactly what we’re gonna do.

Enable Providers in the Console

Go the Firebase Console then navigate to Authentication > Sign-in Method, then enable all your desired log-in methods. Email/password is a standard one and in my opinion, should always be enabled for most apps.

Import the Dependencies

compile 'com.google.firebase:firebase-auth:12.0.1'
compile 'com.firebaseui:firebase-ui-auth:3.2.2'

Add these to your app-level build.gradle file.

*Note: If you want to include Google, Facebook, or Twitter log in, you can find out how to enable that on the official docs.

1. Create a List of your Providers

List<AuthUI.IdpConfig> providers = Arrays.asList(
     new AuthUI.IdpConfig.Builder(AuthUI.EMAIL_PROVIDER).build()
);

Just remember AuthUI.IdpConfig. Most of the code here stems from that.

2. Use AuthUI to Create a SignInIntent

private void initFirebase() {
        String uid = FirebaseAuth.getInstance().getUid();

        if (uid == null) {
            startActivityForResult(AuthUI.getInstance()
            .createSignInIntentBuilder()
            .setAvailableProviders(providers)
            .build(), RC_SIGN_IN);
        }
}

This will launch the ready-made authentication screen provided by FirebaseUI. The screen will adjust itself based on the providers you passed into it to suit these needs.

3. Respond in OnActivityResult

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    super.onActivityResult(requestCode, resultCode, data);

    if (requestCode == RC_SIGN_IN) {
        IdpResponse response = IdpResponse.fromResultIntent(data);

        if (resultCode == RESULT_OK) {
            // Successfully signed in
            FirebaseUser user = FirebaseAuth.getInstance().getCurrentUser();
            // ...
        } else {
            // Sign in failed, check response for error code
            // ...
        }
    }
 }

Let your app know your user has signed in after the sign-in flow so you can take the necessary actions.

Theming the Sign-In Flow

By default, FirebaseUI uses your app’s theme. You can however, pass in a seperate theme for it to use, or perhaps a logo.

startActivityForResult(
    AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(...)
        .setLogo(R.drawable.my_great_logo)      // Set logo drawable
        .setTheme(R.style.MySuperAppTheme)      // Set theme
        .build(),
    RC_SIGN_IN);

Or you can set a custom privacy policy and terms of service.

startActivityForResult(
    AuthUI.getInstance()
        .createSignInIntentBuilder()
        .setAvailableProviders(...)
        .setTosUrl("https://superapp.example.com/terms-of-service.html")
        .setPrivacyPolicyUrl("https://superapp.example.com/privacy-policy.html")
        .build(),
    RC_SIGN_IN);

Signing Out with FirebaseUI

AuthUI.getInstance().signOut(this);

To my surprise, FirebaseUI even provides its own sign out method. What’s different you may ask? You can add an onCompleteListener to it! That’s it. No fancy UI gimmicks here.

And that is all… from me at least

I don’t think I added much necessary optimisation to this topic. The official docs actually have FirebaseUI structured quite nicely, and it’s easily understandable.

 

Tags: