FirebaseUI, Firebase’in kimlik doğrulama SDK’sını kullanıp, programa girişte kullanıcıların giriş yapmasını sağlayan bir kütüphanedir.
- Birden çok kimlik doğrulama yöntemini kullanıcıya sunar.
- Hesap yönetimi , hesap oluşturma ve şifre sıfırlama gibi hesap yönetimi görevlerini yerine getirmek için çalışır.
- Özel Temalar – FirebaseUI’nin görünümünü uygulamanıza uyacak şekilde özelleştirir. Custom layoutlar ile görünümü özelleştirebilirsiniz.
Kütüphaneleri Projeye Ekleme
//Auth
implementation 'com.google.firebase:firebase-auth:19.1.0'
implementation 'com.google.firebase:firebase-core:17.2.0'
implementation 'com.firebaseui:firebase-ui-auth:4.3.1'
implementation 'com.facebook.android:facebook-android-sdk:[5,6)'
implementation 'com.google.android.gms:play-services-auth:17.0.0'
Firebase Auth, core, ui-Auth ve Facebook sdklarını ekleyelim.
Firebase console’dan bir proje açmanız, projeyi yapılandırmanız ve googleservies.json dosyasını .app klasörünün içine atmanız gerekmektedir. Bu yazıda bu yapılandırmalar değil FirebaseUI ile giriş yapılması anlatılacaktır.
Custom Layout Kullanımı
FirebaseUI, özelliği gereği varsayılan bir layout ile çalışır. Seçilen giriş yöntemlerine göre (Google, Facebook vs.) layoutuna seçilenlerin sign butonlarını getirir.
Projede kendi Custom layoutunu yaratarak kendi sign sayfasını yaratıp öyle kullanabilirsiniz.
styles.xml dosyası içinde AppTheme’yı Parent alacak şekilde bir tema oluşturun.
<style name="MyTheme" parent="AppTheme">
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#03a9f4</item>
<item name="colorPrimaryDark">#03a9f4</item>
<item name="windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowContentOverlay">@null</item>
<item name="android:windowBackground">@drawable/background_gradient</item>
</style>
MainActivity.xml layoutu oluşturma.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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:clickable="true"
android:focusable="true"
android:background="@drawable/background_gradient"
tools:context=".MainActivity">
<com.google.android.gms.common.SignInButton
android:id="@+id/SignInButton"
android:layout_width="270dp"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginStart="8dp"
android:layout_marginTop="80dp"
android:layout_marginEnd="8dp"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textview"
tools:ignore="MissingConstraints" />
<com.facebook.login.widget.LoginButton
android:id="@+id/login_button"
android:layout_width="270dp"
android:layout_height="40dp"
android:layout_centerHorizontal="true"
android:layout_gravity="center_horizontal"
android:layout_marginStart="8dp"
android:layout_marginTop="24dp"
android:layout_marginEnd="8dp"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:textAllCaps="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/SignInButton"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="@+id/email_button"
android:layout_width="270dp"
android:layout_height="30dp"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:layout_marginEnd="8dp"
android:background="#ffff"
android:text="E-Mail "
android:textSize="14sp"
android:textColor="#03a9f4"
app:layout_constraintBottom_toTopOf="@+id/progressBar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.496"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/login_button"
app:layout_constraintVertical_bias="0.0" />
<ProgressBar
android:id="@+id/progressBar"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:elevation="5dp"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.918" />
<TextView
android:id="@+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginTop="120dp"
android:layout_marginEnd="8dp"
android:text="Login"
android:textAlignment="center"
android:textColorHint="@color/colorPrimary"
android:textSize="72sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Sign
Custom layoutu oluşturduk. SDK’lar eklendi ve şimdi MainActivity içinde sign oluşturma zamanı. Burada List<> halinde kullanılacak giriş yöntemleri bir liste içinde provider olarak saklanır. Ve Sign zamanı bu List’den çağrılır.
// Choose authentication providers List<AuthUI.IdpConfig> providers = Arrays.asList( new AuthUI.IdpConfig.EmailBuilder().build(), new AuthUI.IdpConfig.GoogleBuilder().build(), new AuthUI.IdpConfig.FacebookBuilder().build() ); // Create and launch sign-in intent Intent intent = AuthUI.getInstance() .createSignInIntentBuilder() .setAvailableProviders(providers) .setTosAndPrivacyPolicyUrls("https://example.com", "https://example.com") .setLogo(R.drawable.ic_launcher_background) .setAlwaysShowSignInMethodScreen(true) .setIsSmartLockEnabled(false) .setTheme(R.style.MyTheme) .setAuthMethodPickerLayout(customLayout) .build(); startActivityForResult(intent, AUTHUI_REQUEST_CODE);
Custom Layout Eklenmesi
AuthMethodPickerLayout customLayout = new AuthMethodPickerLayout
.Builder(R.layout.activity_main)
.setGoogleButtonId(R.id.SignInButton)
.setFacebookButtonId(R.id.login_button)
.setEmailButtonId(R.id.email_button)
.build();
ActivityResult Metodu
@Override protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) { super.onActivityResult(requestCode, resultCode, data); if (requestCode == AUTHUI_REQUEST_CODE) { if (resultCode == RESULT_OK) { // Successfully signed in // We have signed in the user or we have a new user FirebaseUser user = FirebaseAuth.getInstance().getCurrentUser(); Log.d(TAG, "onActivityResult: " + user.toString()); updateUi(user); //Checking for User (New/Old) if (user.getMetadata().getCreationTimestamp() == user.getMetadata().getLastSignInTimestamp()) { //This is a New User } else { //This is a returning user updateUi(user); } sign(); } else { // Signing in failed IdpResponse response = IdpResponse.fromResultIntent(data); if (response == null) { Log.d(TAG, "onActivityResult: the user has cancelled the sign in request"); } else { Log.e(TAG, "onActivityResult: ", response.getError()); } } } }
Sign Intent Metodu
private void sign(){
Intent intent = new Intent(this, Main2Activity.class);
intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
intent.setFlags(Intent.FLAG_ACTIVITY_NO_ANIMATION);
intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
progressBar.setVisibility(View.VISIBLE);
startActivity(intent);
this.finish();
}
İkinci Bir Activity’de Kullanıcıları Bilgileri Getirme
Kullanıcı giriş yaptıktan sonra kimlik tamamlandıktan sonra ikinci bir activitye yönlendirilir. Örnek olarak burada giriş yapan kullanıcının, profil fotoğrafını, ismini ve mail adresini almaya çalışacağız.
İlk olarak layout tasarımı:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".Main2Activity">
<ImageView
android:id="@+id/img_profile"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_marginTop="64dp"
android:src="@drawable/ic_launcher_background"
app:layout_constraintBottom_toTopOf="@id/tvName"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
</ImageView>
<Button
android:id="@+id/logout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="32dp"
android:background="@drawable/background_gradient"
android:onClick="logout"
android:text="LogOut"
android:textColor="#ffff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvMail">
</Button>
<TextView
android:id="@+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="TextView"
app:layout_constraintBottom_toTopOf="@+id/tvMail"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/img_profile" />
<TextView
android:id="@+id/tvMail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:text="TextView"
app:layout_constraintBottom_toTopOf="@+id/logout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvName" />
</androidx.constraintlayout.widget.ConstraintLayout>
Logout İşlemi ve Kullanıcı Bilgilerini Getirme
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
mAuth = FirebaseAuth.getInstance();
user = mAuth.getCurrentUser();
bindViews();
getCurrentUserInfo();
}
Bir metod yazarak giriş yapan kullanıcının bilgilerini ekranda gösterebiliriz. İhtiyacımız olan ise Firebase user metodu.
Imageview içinde fotoğrafı gösterebilmek için Glide kütüphanesini kullandık. Uri ile gelen photo url’ini String değere dönüştürelim. Çünkü Glide, string halinde linki alır ve gösterir.
private void getCurrentUserInfo(){ user = mAuth.getCurrentUser(); String currentUserMail = user.getEmail(); String currentUserName = user.getDisplayName(); Uri userImg=user.getPhotoUrl(); // Profile photo Glide.with(getApplicationContext()).load(userImg.toString()).centerCrop().circleCrop().into(img_profile); tvName.setText(currentUserName); tvMail.setText(currentUserMail); }
Logout İçin
public void logout(View view) { AuthUI.getInstance() .signOut(this) .addOnCompleteListener(new OnCompleteListener<Void>() { public void onComplete(@NonNull Task<Void> task) { FirebaseAuth.getInstance().signOut(); //Facebook signout LoginManager.getInstance().logOut(); Intent i = new Intent(getApplicationContext(), MainActivity.class); startActivity(i); finish(); } }); }
ve programın çıktısı:
Github projesine buradan ulaşabilirsiniz.