Belajar Membuat Authentication di Android dengan Firebase

Yudi Setiawan 7 Maret 2017

Belajar Membuat Authentication di Android dengan Firebase

Pengantar

Firebase merupakan salah satu MBaaS (Mobile Backend as a Service) yang sangat berguna untuk melakukan pengembangan aplikasi tanpa harus memikirkan proses pembuatan aplikasi servernya. Dengan firebase, Anda bisa membuat aplikasi mobile dengan proses yang lebih cepat karena, untuk permasalahan seperti database, authentication login, cloud messaging, dan lainnya sudah diatur oleh si Firebase sendiri. Pada tutorial ini, kita akan mencoba membuat aplikasi mobile dengan memanfaatkan fitur authentication login-nya.

Persiapan Firebase

  1. Sebagai langkah awal, silakan Anda buat terlebih dahulu di https://firebase.google.com/
  2. Selanjutnya pilih MULAILAH SECARA GRATIS seperti pada gambar berikut. Homepage Firebase
  3. Kemudian, pilih BUAT PROYEK BARU. Buat Proyek Baru di Firebase
  4. Masukkan nama proyek yang akan kita buat nantinya di Android Studio. Masukkan Nama Proyek App
  5. Selanjutnya, Anda akan menuju dashboard dari proyek yang barusan dibuat tadi. Dashboard Proyek Firebase App
  6. Kemudian, kita pilih yang Tambahkan Firebase ke aplikasi Android Anda dan selanjutnya Anda isi package name dari aplikasi kita yang akan kita buat di Android Studio. Menambahkan Firebase ke Android Studio
  7. Di langkat berikutnya, Anda akan disuruh untuk mengunduh file google-services.json dan silakan Anda unduh. Unduh File google-services.json
  8. And finally, you're finishing config Firebase. Konfigurasi Firebase berhasil dilakukan

Pembuatan Projek Aplikasi

Pada tutorial ini, saya akan membuat sebuah aplikasi yang berfungsi sebagai note. Dan didalamnya saya akan menambahkan fitur authentication sehingga ketika pertama kali aplikasinya dibuka maka, si pengguna diwajibkan create an account dulu atau sign in if you're already have an account. Sebagai langkah awal, silakan Anda buat projek di Android Studio dengan keterangan seperti pada gambar berikut. Pembuatan Projek Aplikasi

Library dan Gradle

Setelah projek Anda selesai dibuat maka, silakan Anda copy file google-services.json yang Anda unduh tadi dan paste ke direktori app seperti pada gambar berikut. Library Firebase di Android Studio dan setting file build.gradle modul Project menjadi seperti ini di bagian dependencies-nya.

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    repositories {
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:2.2.3'
        classpath 'com.google.gms:google-services:3.0.0'
        classpath 'com.jakewharton:butterknife-gradle-plugin:8.5.1'

        // NOTE: Do not place your application dependencies here; they belong
        // in the individual module build.gradle files
    }
}

allprojects {
    repositories {
        jcenter()
    }
}

task clean(type: Delete) {
    delete rootProject.buildDir
}

}

Selanjutnya, ubah file build.gradle modul App menjadi seperti ini.

apply plugin: 'com.android.application'
apply plugin: 'com.google.gms.google-services'
apply plugin: 'com.jakewharton.butterknife'

android {
    compileSdkVersion 25
    buildToolsVersion "25.0.1"
    defaultConfig {
        applicationId "com.codepolitan.examplefirebaselogin"
        minSdkVersion 15
        targetSdkVersion 25
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:25.1.0'
    compile 'com.android.support.constraint:constraint-layout:1.0.0-beta4'
    compile 'com.android.support:design:25.1.0'
    compile 'com.jakewharton:butterknife:8.5.1'
    compile 'com.jakewharton:butterknife-compiler:8.5.1'
    compile 'com.google.firebase:firebase-auth:10.2.0'
    compile 'com.google.firebase:firebase-database:10.2.0'
    compile 'com.android.support:support-v4:25.1.0'
    testCompile 'junit:junit:4.12'
    compile 'org.greenrobot:eventbus:3.0.0'
}

MainActivity

Selanjutnya, pada file activity_main.xml kita ubah isinya menjadi seperti berikut.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    tools:context="com.codepolitan.examplefirebaselogin.main.MainActivity"
    >

    <ImageView
        android:layout_width="130dp"
        android:layout_height="130dp"
        android:id="@+id/image_view_icon_firebase_activity_main"
        android:src="@drawable/ic_firebase"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="30dp"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/edit_text_username_activity_main"
        android:hint="Username"
        android:imeOptions="actionNext"
        android:maxLines="1"
        android:singleLine="true"
        android:textColor="@android:color/white"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:layout_marginRight="@dimen/activity_horizontal_margin"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:layout_below="@+id/image_view_icon_firebase_activity_main"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        />

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/edit_text_password_activity_main"
        android:hint="Password"
        android:imeOptions="actionDone"
        android:maxLines="1"
        android:singleLine="true"
        android:textColor="@android:color/white"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:layout_marginRight="@dimen/activity_horizontal_margin"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:layout_below="@+id/edit_text_username_activity_main"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        android:inputType="textPassword"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="@dimen/activity_horizontal_margin"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:id="@+id/button_login_activity_main"
        android:text="Login"
        android:layout_below="@id/edit_text_password_activity_main"
        android:textColor="@android:color/white"
        android:background="@drawable/background_button_orange"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/button_sign_up_activity_main"
        android:minWidth="0dp"
        android:minHeight="0dp"
        android:background="@drawable/background_text_view_create_account"
        android:textAllCaps="false"
        android:text="Create an account"
        android:textColor="@android:color/white"
        android:textSize="15sp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        android:paddingTop="10dp"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingBottom="10dp"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/text_view_not_registered_activity_main"
        android:text="Not registered?"
        android:gravity="center"
        android:layout_above="@+id/button_sign_up_activity_main"
        android:layout_centerHorizontal="true"
        />

    <!-- for progress loading -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/relative_layout_progress_activity_main"
        android:background="@android:color/black"
        android:alpha="0.7"
        android:clickable="true"
        android:visibility="gone"
        >

        <ProgressBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            />

    </RelativeLayout>

</RelativeLayout>

dan file MainActivity.java menjadi seperti berikut.

package com.codepolitan.examplefirebaselogin.main;

import android.content.DialogInterface;
import android.content.Intent;
import android.support.annotation.NonNull;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RelativeLayout;


import com.codepolitan.examplefirebaselogin.dashboard.DashboardActivity;
import com.codepolitan.examplefirebaselogin.R;
import com.codepolitan.examplefirebaselogin.signup.SignupActivity;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.relative_layout_progress_activity_main)
    RelativeLayout relativeLayoutProgress;
    @BindView(R.id.edit_text_username_activity_main)
    EditText editTextUsername;
    @BindView(R.id.edit_text_password_activity_main)
    EditText editTextPassword;

    private FirebaseAuth firebaseAuth;
    private boolean loggedIn;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initFirebase();
        ButterKnife.bind(this);
        loggedIn = isLoggedIn();
        if (loggedIn) {
            //  go to dashboard
            goToDashboard();
        }
    }

    private void initFirebase() {
        firebaseAuth = FirebaseAuth.getInstance();
    }

    private void goToDashboard() {
        Intent intent = new Intent(this, DashboardActivity.class);
        intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK | Intent.FLAG_ACTIVITY_CLEAR_TASK);
        startActivity(intent);
    }

    @OnClick({R.id.button_login_activity_main, R.id.button_sign_up_activity_main})
    public void onClick(Button button) {
        switch (button.getId()) {
            case R.id.button_login_activity_main:
                String username = editTextUsername.getText().toString().trim();
                String password = editTextPassword.getText().toString().trim();
                login(username, password);
                break;
            case R.id.button_sign_up_activity_main:
                //  go to form pendaftaran
                startActivity(new Intent(this, SignupActivity.class));
                break;
        }
    }

    private void login(final String username, final String password) {
        if (TextUtils.isEmpty(username)) {
            Snackbar.make(findViewById(android.R.id.content), R.string.error_message_username_empty, Snackbar.LENGTH_LONG)
                    .show();
        } else if (TextUtils.isEmpty(password)) {
            Snackbar.make(findViewById(android.R.id.content), R.string.error_message_password_empty, Snackbar.LENGTH_LONG)
                    .show();
        } else {
            //  do login
            showProgress();
            firebaseAuth.signInWithEmailAndPassword(username, password)
                    .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
                        @Override
                        public void onComplete(@NonNull Task<AuthResult> task) {
                            hideProgress();
                            if (task.isSuccessful()) {
                                //  login sucess
                                //  go to dashboard
                                goToDashboard();
                            } else {
                                //  login failed
                                showMessageBox("Login failed. Your username and password is not matched");
                            }
                        }
                    });

        }
    }

    private void hideProgress() {
        relativeLayoutProgress.setVisibility(View.GONE);
        editTextUsername.setEnabled(true);
        editTextPassword.setEnabled(true);
    }

    private void showProgress() {
        relativeLayoutProgress.setVisibility(View.VISIBLE);
        editTextUsername.setEnabled(false);
        editTextPassword.setEnabled(false);
    }

    private void showMessageBox(String message) {
        AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(this);
        alertDialogBuilder.setTitle("Login");
        alertDialogBuilder.setMessage(message);
        alertDialogBuilder.setCancelable(false);
        alertDialogBuilder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialogInterface, int i) {
                dialogInterface.dismiss();
            }
        });
        alertDialogBuilder.show();
    }

    public boolean isLoggedIn() {
        if (firebaseAuth.getCurrentUser() != null) {
            //  user logged in
            return true;
        } else {
            return false;
        }
    }
}

MainActivity.java kita jadikan sebagai menu awal untuk login dan pada menu ini ada 2 pilihan, yaitu, login atau signup.

Signup

Buat activity baru dan beri nama SignupActivity dan ubah file layout-nya menjadi seperti berikut.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_signup"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    android:orientation="vertical"
    tools:context="com.codepolitan.examplefirebaselogin.signup.SignupActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin">

        <TextView
            android:id="@+id/text_view_signup_activity_signup"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:text="Sign up"
            android:textColor="@android:color/white"
            android:textSize="24sp" />

        <EditText
            android:id="@+id/edit_text_email_activity_signup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/text_view_signup_activity_signup"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            android:inputType="textEmailAddress"
            android:hint="Email"
            android:imeOptions="actionNext"
            android:maxLines="1"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:singleLine="true"
            android:textColor="@android:color/white" />

        <EditText
            android:id="@+id/edit_text_password_activity_signup"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/edit_text_email_activity_signup"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            android:hint="Password"
            android:imeOptions="actionDone"
            android:inputType="textPassword"
            android:textColor="@android:color/white"
            android:maxLines="1"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:singleLine="true" />

        <Button
            android:id="@+id/button_next_activity_signup"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:background="@drawable/background_button_orange_transparent"
            android:drawableEnd="@drawable/ic_navigate_next"
            android:drawableRight="@drawable/ic_navigate_next"
            android:minHeight="0dp"
            android:minWidth="0dp"
            android:paddingBottom="10dp"
            android:paddingLeft="14dp"
            android:paddingRight="14dp"
            android:paddingTop="10dp"
            android:text="Next"
            android:textAllCaps="false"
            android:textColor="@color/colorAccent"
            android:textSize="24sp" />

    </RelativeLayout>

    <!--for progress loading-->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/relative_layout_progress_activity_signup"
        android:background="@android:color/black"
        android:alpha="0.7"
        android:visibility="gone"
        >

        <ProgressBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            />

    </RelativeLayout>

</RelativeLayout>

Kemudian, ubah juga file java nya menjadi seperti berikut.

package com.codepolitan.examplefirebaselogin.signup;

import android.content.DialogInterface;
import android.support.annotation.NonNull;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RelativeLayout;

import com.codepolitan.examplefirebaselogin.R;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

public class SignupActivity extends AppCompatActivity {

    @BindView(R.id.edit_text_email_activity_signup)
    EditText editTextEmail;
    @BindView(R.id.edit_text_password_activity_signup)
    EditText editTextPassword;
    @BindView(R.id.relative_layout_progress_activity_signup)
    RelativeLayout relativeLayoutProgress;

    FirebaseAuth firebaseAuth;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_signup);
        ButterKnife.bind(this);
        initFirebase();
    }

    private void initFirebase() {
        firebaseAuth = FirebaseAuth.getInstance();
    }

    @OnClick({R.id.button_next_activity_signup})
    public void onClick(Button button) {
        switch (button.getId()) {
            case R.id.button_next_activity_signup:
                String email = editTextEmail.getText().toString().trim();
                String password = editTextPassword.getText().toString().trim();
                signup(email, password);
                break;
        }
    }

    private void signup(String email, String password) {
        if (TextUtils.isEmpty(email)) {
            Snackbar.make(findViewById(android.R.id.content), R.string.error_message_username_empty, Snackbar.LENGTH_LONG)
                    .show();
        } else if (TextUtils.isEmpty(password)) {
            Snackbar.make(findViewById(android.R.id.content), R.string.error_message_password_empty, Snackbar.LENGTH_LONG)
                    .show();
        } else {
            showProgress();
            firebaseAuth.createUserWithEmailAndPassword(email, password)
                    .addOnCompleteListener(new OnCompleteListener<AuthResult>() {
                        @Override
                        public void onComplete(@NonNull Task<AuthResult> task) {
                            hideProgress();
                            if (task.isSuccessful()) {
                                //  signup success
                                AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(SignupActivity.this);
                                alertDialogBuilder.setTitle("Signup");
                                alertDialogBuilder.setMessage("Your account has been registered. Please sign in use your username and password.");
                                alertDialogBuilder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                                    @Override
                                    public void onClick(DialogInterface dialogInterface, int i) {
                                        dialogInterface.dismiss();
                                        finish();
                                    }
                                });
                                alertDialogBuilder.show();
                            } else {
                                task.getException().printStackTrace();
                                //  signup fail
                                final Snackbar snackbar = Snackbar.make(findViewById(android.R.id.content), "registered has been failed! Please try again.", Snackbar.LENGTH_INDEFINITE);
                                snackbar.setAction("OK", new View.OnClickListener() {
                                    @Override
                                    public void onClick(View view) {
                                        snackbar.dismiss();
                                    }
                                });
                                snackbar.setActionTextColor(getResources().getColor(R.color.colorAccent));
                                snackbar.show();
                            }
                        }
                    });
        }
    }

    private void hideProgress() {
        relativeLayoutProgress.setVisibility(View.GONE);
    }

    private void showProgress() {
        relativeLayoutProgress.setVisibility(View.VISIBLE);
    }
}

Seperti yang Anda lihat bahwa, untuk menggunakan authentication sign up di Firebase Anda bisa menggunakan createUserWithEmailAndPassword dilanjutkan dengan 2 parameter email dan password.

Dashboard

Buat file navigation drawer activity baru dengan nama DashboardActivity. Selanjutnya, ubah file layout-nya menjadi seperti berikut.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_dashboard"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_dashboard"
        app:menu="@menu/activity_dashboard_drawer" />

</android.support.v4.widget.DrawerLayout>

Dan ubah juga file java-nya menjadi seperti berikut.

package com.codepolitan.examplefirebaselogin.dashboard;

import android.content.Intent;
import android.os.Bundle;
import android.support.design.widget.NavigationView;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;

import com.codepolitan.examplefirebaselogin.dashboard.account.change.password.ChangePasswordDialogFragment;
import com.codepolitan.examplefirebaselogin.dashboard.account.change.username.ChangeUsernameDialogFragment;
import com.codepolitan.examplefirebaselogin.dashboard.data.add.NewDataFragment;
import com.codepolitan.examplefirebaselogin.dashboard.home.HomeFragment;
import com.codepolitan.examplefirebaselogin.R;
import com.codepolitan.examplefirebaselogin.main.MainActivity;
import com.google.firebase.auth.FirebaseAuth;

public class DashboardActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_dashboard);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_dashboard);
        setSupportActionBar(toolbar);

        getSupportFragmentManager().beginTransaction()
                .add(R.id.frame_layout_content_dashboard, new HomeFragment(), HomeFragment.class.getSimpleName())
                .commit();

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();

        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);
    }

    @Override
    public void onBackPressed() {
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        if (drawer.isDrawerOpen(GravityCompat.START)) {
            drawer.closeDrawer(GravityCompat.START);
        } else {
            super.onBackPressed();
        }
    }

    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case R.id.nav_change_password:
                ChangePasswordDialogFragment changePasswordDialogFragment = new ChangePasswordDialogFragment();
                changePasswordDialogFragment.show(getSupportFragmentManager(), null);
                break;
            case R.id.nav_change_email:
                ChangeUsernameDialogFragment changeUsernameDialogFragment = new ChangeUsernameDialogFragment();
                changeUsernameDialogFragment.show(getSupportFragmentManager(), null);
                break;
            case R.id.nav_logout:
                FirebaseAuth firebaseAuth = FirebaseAuth.getInstance();
                firebaseAuth.signOut();
                Intent intent = new Intent(this, MainActivity.class);
                intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);
                startActivity(intent);
                break;
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }
}

Pada aplikasi ini sebenarnya, kita ada menggunakan fitur Database Realtime miliki si Firebase namun, itu tidak akan saya jelaskan di sini karena di sini fokusnya kita ke fitur Authentication si Firebase. Seperti yang Anda lihat pada method onNavigationItemSelected ada 3 menu item yaitu, change password, change email, dan logout. Untuk logout, Anda cukup menggunakan syntax signOut untuk mengeluarkan akun Anda dan kembali ke menu login.

ChangePassword

Buat file layout baru dengan nama dialog_fragment_change_password.xml dan isi dengan source code berikut.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    >

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_email_old_dialog_fragment_change_password"
            android:hint="Email"
            android:inputType="textEmailAddress"
            android:paddingBottom="@dimen/activity_vertical_margin"
            />

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_password_dialog_fragment_change_password"
            android:hint="Password"
            android:inputType="textPassword"
            android:paddingBottom="@dimen/activity_vertical_margin"
            />

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_password_new_dialog_fragment_change_password"
            android:hint="Password new"
            android:inputType="textPassword"
            android:paddingBottom="@dimen/activity_vertical_margin"
            />

    </android.support.design.widget.TextInputLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="13dp"
        >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button_save_password_dialog_fragment_change_password"
            android:text="@string/save"
            android:textAllCaps="false"
            android:background="@drawable/background_button_orange_transparent"
            android:minWidth="0dp"
            android:minHeight="0dp"
            android:paddingTop="13dp"
            android:paddingRight="16dp"
            android:paddingBottom="13dp"
            android:paddingLeft="16dp"
            android:textColor="@color/colorAccent"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            />

        <ProgressBar
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:id="@+id/progress_bar_dialog_fragment_change_password"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_marginTop="13dp"
            android:layout_marginRight="16dp"
            android:layout_marginEnd="16dp"
            android:layout_marginBottom="13dp"
            android:layout_marginLeft="16dp"
            android:layout_marginStart="16dp"
            android:visibility="gone"
            />

    </RelativeLayout>

</LinearLayout>

dan kemudian, buat file java baru dengan nama ChangePasswordDialogFragment.java dan isi dengan source code berikut.

package com.codepolitan.examplefirebaselogin.dashboard.account.change.password;

import android.content.DialogInterface;
import android.content.Intent;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.widget.Snackbar;
import android.support.v4.app.DialogFragment;
import android.support.v7.app.AlertDialog;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ProgressBar;

import com.codepolitan.examplefirebaselogin.R;
import com.codepolitan.examplefirebaselogin.main.MainActivity;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

/**
 * Created by root on 04/03/17.
 */

public class ChangePasswordDialogFragment extends DialogFragment {

    private View view;
    @BindView(R.id.edit_text_email_old_dialog_fragment_change_password)
    EditText editTextEmail;
    @BindView(R.id.edit_text_password_dialog_fragment_change_password)
    EditText editTextPassword;
    @BindView(R.id.edit_text_password_new_dialog_fragment_change_password)
    EditText editTextPasswordNew;
    @BindView(R.id.progress_bar_dialog_fragment_change_password)
    ProgressBar progressBar;
    @BindView(R.id.button_save_password_dialog_fragment_change_password)
    Button buttonSave;

    private FirebaseAuth firebaseAuth;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.dialog_fragment_change_password, container, false);
        getDialog().setTitle("Change Password");
        ButterKnife.bind(this, view);
        initFirebaseAuth();
        return view;
    }

    private void initFirebaseAuth() {
        firebaseAuth = FirebaseAuth.getInstance();
    }

    @OnClick({R.id.button_save_password_dialog_fragment_change_password})
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.button_save_password_dialog_fragment_change_password:
                //  do something
                String email = editTextEmail.getText().toString().trim();
                String password = editTextPassword.getText().toString().trim();
                final String passwordNew = editTextPasswordNew.getText().toString().trim();
                if (TextUtils.isEmpty(email)) {
                    showMessageSnackbar("Email is empty!");
                } else if (TextUtils.isEmpty(password)) {
                    showMessageSnackbar("Password is empty!");
                } else if (TextUtils.isEmpty(passwordNew)) {
                    showMessageSnackbar("Please insert your password new!");
                } else {
                    showProgress();
                    firebaseAuth.signInWithEmailAndPassword(email, password)
                            .addOnCompleteListener(new OnCompleteListener<AuthResult>() {
                                @Override
                                public void onComplete(@NonNull Task<AuthResult> task) {
                                    if (task.isSuccessful()) {
                                        firebaseAuth.getCurrentUser()
                                                .updatePassword(passwordNew)
                                                .addOnCompleteListener(new OnCompleteListener<Void>() {
                                                    @Override
                                                    public void onComplete(@NonNull Task<Void> task) {
                                                        hideProgress();
                                                        if (task.isSuccessful()) {
                                                            AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(getContext());
                                                            alertDialogBuilder.setTitle("Change Password");
                                                            alertDialogBuilder.setMessage("Your password has been changed! Please login again.");
                                                            alertDialogBuilder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                                                                @Override
                                                                public void onClick(DialogInterface dialogInterface, int i) {
                                                                    dialogInterface.dismiss();
                                                                    firebaseAuth.signOut();
                                                                    Intent intent = new Intent(getContext(), MainActivity.class);
                                                                    intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);
                                                                    startActivity(intent);
                                                                    getDialog().dismiss();
                                                                }
                                                            });
                                                            alertDialogBuilder.show();
                                                        } else {
                                                            showMessageSnackbar("Your password fail to changed!");
                                                            getDialog().dismiss();
                                                        }
                                                    }
                                                });
                                    } else {
                                        showMessageSnackbar("Your email and password is not matched!");
                                        getDialog().dismiss();
                                    }
                                }
                            });
                }
        }
    }

    private void showProgress() {
        progressBar.setVisibility(View.VISIBLE);
        buttonSave.setVisibility(View.GONE);
        editTextEmail.setEnabled(false);
        editTextPassword.setEnabled(false);
        editTextPasswordNew.setEnabled(false);
    }

    private void hideProgress() {
        progressBar.setVisibility(View.GONE);
        buttonSave.setVisibility(View.VISIBLE);
        editTextEmail.setEnabled(true);
        editTextPassword.setEnabled(true);
        editTextPasswordNew.setEnabled(true);
    }

    private void showMessageSnackbar(String message) {
        Snackbar.make(getActivity().findViewById(android.R.id.content), message, Snackbar.LENGTH_LONG)
                .show();
    }
}

Perhatikan baik-baik pada kode diatas, bahwa untuk mengganti password authentication di Firebase Anda diharuskan melakukan sign in lagi dan kemudian, dilanjutkan mengubah password-nya.

Change Email

Buat satu file layout baru dengan nama dialog_fragment_change_email.xml dan isi dengan source code berikut.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    >

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_email_old_dialog_fragment_change_email"
            android:inputType="textEmailAddress"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:hint="Email"
            />

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_password_dialog_fragment_change_email"
            android:inputType="textPassword"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:hint="Password"
            />

    </android.support.design.widget.TextInputLayout>

    <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        >

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/edit_text_email_new_dialog_fragment_change_email"
            android:hint="Email new"
            android:inputType="textEmailAddress"
            android:paddingBottom="@dimen/activity_vertical_margin"
            />

    </android.support.design.widget.TextInputLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="13dp"
        >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/button_save_email_dialog_fragment_new_email"
            android:text="@string/save"
            android:textAllCaps="false"
            android:background="@drawable/background_button_orange_transparent"
            android:textColor="@color/colorAccent"
            android:minWidth="0dp"
            android:minHeight="0dp"
            android:paddingTop="13dp"
            android:paddingRight="16dp"
            android:paddingBottom="13dp"
            android:paddingLeft="16dp"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            />

        <ProgressBar
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:id="@+id/progress_bar_dialog_fragment_change_email"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_marginTop="13dp"
            android:layout_marginRight="16dp"
            android:layout_marginBottom="13dp"
            android:layout_marginLeft="16dp"
            android:visibility="gone"
            />

    </RelativeLayout>

</LinearLayout>

Selanjutnya, buat file java baru dengan nama ChangeUsernameDialogFragment.java dan isi dengan source code berikut.

package com.codepolitan.examplefirebaselogin.dashboard.account.change.username;

import android.content.DialogInterface;
import android.content.Intent;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.design.widget.Snackbar;
import android.support.v4.app.DialogFragment;
import android.support.v7.app.AlertDialog;
import android.text.TextUtils;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ProgressBar;

import com.codepolitan.examplefirebaselogin.R;
import com.codepolitan.examplefirebaselogin.main.MainActivity;
import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

/**
 * Created by root on 04/03/17.
 */

public class ChangeUsernameDialogFragment extends DialogFragment {

    private View view;
    @BindView(R.id.edit_text_email_old_dialog_fragment_change_email)
    EditText editTextEmail;
    @BindView(R.id.edit_text_password_dialog_fragment_change_email)
    EditText editTextPassword;
    @BindView(R.id.edit_text_email_new_dialog_fragment_change_email)
    EditText editTextEmailNew;
    @BindView(R.id.progress_bar_dialog_fragment_change_email)
    ProgressBar progressBar;
    @BindView(R.id.button_save_email_dialog_fragment_new_email)
    Button buttonSaveEmail;

    private FirebaseAuth firebaseAuth;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.dialog_fragment_change_email, container, false);
        getDialog().setTitle("Change Email");
        ButterKnife.bind(this, view);
        initFirebaseAuth();
        return view;
    }

    private void initFirebaseAuth() {
        firebaseAuth = FirebaseAuth.getInstance();
    }

    @OnClick({R.id.button_save_email_dialog_fragment_new_email})
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.button_save_email_dialog_fragment_new_email:
                String email = editTextEmail.getText().toString().trim();
                String password = editTextPassword.getText().toString().trim();
                final String emailNew = editTextEmailNew.getText().toString().trim();
                if (TextUtils.isEmpty(email)) {
                    showMessageSnackBar("email is empty!");
                } else if (TextUtils.isEmpty(password)) {
                    showMessageSnackBar("password is empty!");
                } else if (TextUtils.isEmpty(emailNew)) {
                    showMessageSnackBar("Please insert your email address!");
                } else {
                    showProgress();
                    firebaseAuth.signInWithEmailAndPassword(email, password)
                            .addOnCompleteListener(new OnCompleteListener<AuthResult>() {
                                @Override
                                public void onComplete(@NonNull Task<AuthResult> task) {
                                    if (task.isSuccessful()) {
                                        firebaseAuth.getCurrentUser()
                                                .updateEmail(emailNew)
                                                .addOnCompleteListener(new OnCompleteListener<Void>() {
                                                    @Override
                                                    public void onComplete(@NonNull Task<Void> task) {
                                                        hideProgress();
                                                        if (task.isSuccessful()) {
                                                            AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(getContext());
                                                            alertDialogBuilder.setTitle("Change Email");
                                                            alertDialogBuilder.setMessage("Your email address has been updated! Please login again.");
                                                            alertDialogBuilder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                                                                @Override
                                                                public void onClick(DialogInterface dialogInterface, int i) {
                                                                    firebaseAuth.signOut();
                                                                    Intent intent = new Intent(getActivity(), MainActivity.class);
                                                                    intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);
                                                                    startActivity(intent);
                                                                    getDialog().dismiss();
                                                                    dialogInterface.dismiss();
                                                                }
                                                            });
                                                            alertDialogBuilder.show();
                                                        } else {
                                                            getDialog().dismiss();
                                                            showMessageSnackBar("Your email address fail to updated!");
                                                        }
                                                    }
                                                });
                                    } else {
                                        showMessageSnackBar("Your email or password not matched!");
                                    }
                                }
                            });
                }
        }
    }

    private void hideProgress() {
        progressBar.setVisibility(View.GONE);
        buttonSaveEmail.setVisibility(View.VISIBLE);
        editTextEmail.setEnabled(true);
        editTextPassword.setEnabled(true);
        editTextEmailNew.setEnabled(true);
    }

    private void showProgress() {
        progressBar.setVisibility(View.VISIBLE);
        buttonSaveEmail.setVisibility(View.GONE);
        editTextEmail.setEnabled(false);
        editTextPassword.setEnabled(false);
        editTextEmailNew.setEnabled(false);
    }

    private void showMessageSnackBar(String message) {
        Snackbar.make(getActivity().findViewById(android.R.id.content), message, Snackbar.LENGTH_LONG)
                .show();
    }
}

Sekali lagi hampir sama seperti pada cara mengubah password Anda diharuskan sign in lagi dan dilanjutkan untuk proses penyetelan email baru. Sebenarnya, masih banyak fitur-fitur yang bisa Anda explore lagi authentication di Firebase seperti, sendPasswordResetEmail, confirmPasswordReset dan masih banyak lagi. Silakan Anda explore sendiri ya di documentation-nya Firebase.

Output

Login
Sign up
Dashboard
Menu Navigation
Change Password
Change Username

Semua file pendukung pada projek ini bisa Anda pelajari di sini