Huawei Account Kit (Jetpack Compose ile)

Sertaç Ayhan
Huawei Developers - Türkiye
5 min readFeb 8, 2022

Giriş

Merhabalar, bu yazıyı Huawei’nin en çok kullanılan kiti olan Account Kit’i, Android’in native UI’lar tasarlamak için geliştirilen yeni modern toolkit’i Jetpack Compose ile nasıl kullanırız sorusuna cevap olması için yazıyorum.

  1. Huawei Account Kit Nedir?

Huawei Account Kit, kullanıcılara basit, güvenli ve hızlı bir şekilde e-mail ve şifre gerektirmeden, kullanıcının sadece Huawei ID’si ile , Huawei ID ile giriş yap butonuna tıklayarak oturum açma ve uygulamayı yetkilendirme özelliği sağlayan bir mobil servistir.

Account kit için detaylı bilgiye aşağıdaki makaleden ulaşabilirsiniz :

1.1 Huawei Account Kit Projeye Nasıl Entegre Edilir?

Account Kit’i projeye entegre edebilmek için bazı gereksinimlere ihtiyacımız var.

Donanım Gereksinimleri

  • Windows 8/10 işletim sistemini çalıştırılabilen bir bilgisayar veya MacOS® 10.14 (Mojave) veya üstü
  • Demo projeyi çalıştırmak ve debug edebilmek için HMS Core (APK) 4.0.0.300 veya üzerini destekleyen bir Huawei cep telefonu

Yazılım Gereksinimleri

  • JDK versiyonu: 1.8 veya üstü
  • Android Studio versiyonu: 3.6.1 veya üstü
  • minSdkVersion: 17 veya üstü
  • targetSdkVersion: 31 (tavsiye edilen)
  • compileSdkVersion: 31 (tavsiye edilen)
  • Gradle versiyonu: 5.4.1 veya üstü (tavsiye edilen)

Dipnot : Bu gereksinimler Huawei Account kit içindir. Jetpack Compose setup sayfasında Arctic Fox sürümü önerilmektedir.

1.2 HMS Core Entegrasyonu

Account kiti projemizde kullanabilmek için HMS Core’u projemize entegre etmemiz gerekiyor.

ÖNEMLİ NOT : Jetpack Compose’u kullanabilmemiz için Android Studio’da proje oluştururken, Choose your project sayfasında Empty Compose Activity’i seçmemiz gerekmektedir.

Bu adımların detaylı bir şekilde anlatıldığı Preparations for Integrating HUAWEI HMS Core kılavuzumuza göz atmayı unutmayın :

https://developer.huawei.com/consumer/en/codelab/HMSPreparation/index.html#0

HMS Core’u projemize entegre ettikten sonra Account kit’i projemizde kullanabilmemiz için App klasörünün altında bulunan build.gradle dosyasını açın ve dependencies bölümüne aşağıdaki satırı ekleyin.(En son sdk versiyonunu görebilmek için link’e tıklayabilirsiniz)

Eğer projenizin görünümü Android ise app klasörünün altında bulunan gradle dosyamız Gradle Scripts’in altındaki build.gradle(Module : xyz.app) dosyasıdır.

build.gradle

Şimdi Compose ile Screen’lerimizi tanımlayıp (eski adıyla layout) sonrasında Account kit’i ile nasıl kullanacağımızı anlatacağım.

Huawei’nin Developer sayfasında bulunan Account kit dökümantasyonun function based development altındaki Sign in with an ID dökümanını kullandım. Linkten dökümantasyonu inceleyebilirsiniz.

Function based development -> Sign in with an ID

@Composable anotasyonu ile LoginScreen ve HomeScreen şeklinde iki adet ekran tanımlayalım. Bu ekranları Screens.kt dosyasında toplayalım. Account kit’in logic’ine geçmeden önce, LoginScreen içindeki Column’a dikkat çekmek istiyorum. Column dediğimiz parametre XML ile layout tasarlarken kullandığımız LinearLayout’a karşılık gelmekte. Bir Text olarak LoginScreen’de olduğumuzu belirten “Hello this is Login Screen” text’i ile Account kit ile login olup, HomeScreen’e yönlendirici olarak kullanacağımız bir Button tanımlayalım. Bu butonu HUAWEI ID Sign-In Button kullanım kuralları ‘na uygun hale getirelim. Ben kodumda Hard coded metinler kullanmamak adına kullanacağım metinleri res>values>strings.xml dosyasında tanımlayıp ekranımda çağırdım. Aşağıda Screens.kt dosyasını görebilirsiniz. Buradan sonra önemli noktalara yazımın devamına değiniyor olacağım.

Screens.kt

Huawei ID ile giriş işleminde kullanacağımız, parametre olarak ManagedActivityResultLauncher<Intent, ActivityResult> tipinde bir launcher ve context alan signByHwId isimli bir fonksiyon yazalım. İçerisinde, yetkilendirme için AccountAuthParamsHelper.setAuthorizationCode methodunu çağıralım ve authParams değişkenine atayalım.

Aynı fonksiyon içerisinde AccountAuthManager.getService methodunu AccountAuthService objesini başlatmak için mAuthManager değişkenine atayalım. getService methodumuz parametre olarak Context ve AccountAuthParams aldığı için context’i parametre olarak signByHwId fonksiyonumuza verdik.

AccountAuthService getService function.

AccountAuthService.getSignInIntent methodunu yetkilendirme ekranını göstermek için launcher.launch yardımıyla başlatalım.

Yetkilendirme sonucunu işleyebilmek adına activityResult fonksiyonu yazıp if (authAccountTask.isSuccessful) bloğunun içinde authAccount değişkenine authAccountTask.result atayıp Log olarak giriş işleminin sonucunu yazdıralım. Ve ardından navController.navigate(“home”) diyerek HomeScreen’e navigasyonu sağlayalım.

authAccountTask.isSuccesful

Dökümantasyonda startActivityForResult ile yaptığımız işi launcher.launch(mAuthManager?.signInIntent) ile ,onActivityResult ile yaptığımız işi ise activityResult fonksiyonuyla yapıyoruz. Bunun sebebi onActivityResult fonksiyonunun deprecated olması. Yerine registerForActivityResult gelmişti. Fakat compose ile birlikte adı rememberLauncherForActivityResult olarak değiştirildi. İlginizi çektiyse aşağıdaki linklerden yeni yapıyı inceleyebilirsiniz.

https://developer.android.com/reference/kotlin/androidx/activity/compose/package-summary

MainActivity içinde Jetpack Compose navigation’ı handle ediyoruz.

MainActivity.kt

Yaptığımız demo proje şu şekilde görünecektir :

Login and Auth
After auth login
After authorization login

Son olarak karşılaştırma yapabilmeniz adına Compose’dan önce Sign in with an ID implemantasyonunun kaynak kodunu sizler için hazırladım. Aşağıda görebilirsiniz. Bu kod xml dosyasında bir textview bir buton ve nav_graph.xml’e sahiptir.

MainActivityOld.kt

Jetpack Compose ile ilgili daha fazla bilgi almak için aşağıdaki makalelere göz atabilirsiniz :

--

--