DEV Community: MuraliAkula1

Log in via SMS and Forgot password? Features using Huawei Account Kit in Attendance Tracker Android app (Kotlin) – Part 2

MuraliAkula1 — Sun, 06 Mar 2022 08:48:06 +0000

Introduction
In this article, we can find the Huawei Account Kit of Log in via SMS and Forgot password? features in Attendance Tracker app. The Log in via SMS is an alternative way of login with Huawei ID, instead of providing password user can enter SMS code from registered Phone Number. Forgot password? can be used when you forgot your password, you can reset the password using the Huawei ID and SMS code will be sent for verification. So, I will provide the series of articles on this Attendance Tracker App, in upcoming articles I will integrate other Huawei Kits.

Account Kit
Huawei Account Kit provides for developers with simple, secure, and quick sign-in and authorization functions. User is not required to enter accounts, passwords and waiting for authorization. User can click on Sign In with HUAWEI ID button to quickly and securely sign in to the app.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signingReport, as follows.

Note: Project Name depends on the user created name.

Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android **Project **under **app **directory, as follows.
Enter SHA-256 certificate fingerprint and click **Save **button, as follows.

Click Manage APIs tab and enable Account Kit.
Add the below maven URL in build.gradle(Project) file under the repositories of buildscript, dependencies and allprojects, refer Add Configuration.
maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file.
apply plugin: id 'com.huawei.agconnect' // Huawei AGC implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300' // Huawei Account Kit implementation 'com.huawei.hms:hwid:6.3.0.301' // Huawei Ads Kit implementation 'com.huawei.hms:ads:3.4.51.300'
Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file.
// Account Kit <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> // Ads Kit <uses-permission android:name="android.permission.INTERNET" />

Let us move to development

I have created a project on Android studio with empty activity let us start coding.

In the MainActivity.kt we can find the business logic for ads.
`class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    // Initialize the Huawei Ads SDK
    HwAds.init(this)
    loadDefaultBannerAd()
}

// To get Banner view from the activity_main.xml. It will display at bottom of the page.
private fun loadDefaultBannerAd() {
    val bottomBannerView = findViewById<BannerView>(R.id.hw_banner_view)
    val adParam = AdParam.Builder().build()
    bottomBannerView.adId = getString(R.string.banner_ad_id) // banner_ad_id is testw6vs28auh3
    bottomBannerView.bannerAdSize = BannerAdSize.BANNER_SIZE_SMART
    bottomBannerView.loadAd(adParam)
}

In the activity_main.xml we can create the UI screen.
`<?xml version="1.0" encoding="utf-8"?>
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:orientation="vertical"
tools:context=".MainActivity">

<com.huawei.hms.ads.banner.BannerView
    android:id="@+id/hw_banner_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_marginTop="10dp"
    android:layout_marginBottom="10dp"/>

In the Home.kt we can find the business logic for logout.
`class Home : AppCompatActivity() {

private var mAuthManager: AccountAuthService? = null
private var mAuthParam: AccountAuthParams? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_home)

    img_logout.setOnClickListener(mOnClickListener)

}

private fun signOut() {
    mAuthParam = AccountAuthParamsHelper(AccountAuthParams.DEFAULT_AUTH_REQUEST_PARAM)
                 .createParams()
    mAuthManager = AccountAuthManager.getService(this@Home, mAuthParam)
    val signOutTask = mAuthManager?.signOut()
    signOutTask?.addOnSuccessListener {
        Toast.makeText(this, "signOut Success", Toast.LENGTH_SHORT).show()
        val intent = Intent(this@Home, MainActivity::class.java)
        startActivity(intent)
    }?.addOnFailureListener {
        Toast.makeText(this, "signOut fail", Toast.LENGTH_SHORT).show()
    }
}

private val mOnClickListener: View.OnClickListener = object : View.OnClickListener {
    override fun onClick(v: View?) {
        when (v?.id) {
            R.id.img_logout -> signOut()
        }
    }
}

In the activity_home.xml we can create the UI screen.
`<?xml version="1.0" encoding="utf-8"?>
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:orientation="vertical"
tools:context=".Home">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:gravity="center"
    android:padding="10dp"
    android:layout_marginTop="20dp">
    <ImageView
        android:id="@+id/img_logout"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="20dp"
        android:src="@drawable/logout"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/black"
        android:layout_marginRight="20dp"
        android:layout_marginTop="10dp"
        android:textSize="18sp"
        android:text="Logout"/>
</LinearLayout>

Demo

Log in via SMS

Forgot password?

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get AndriodManifest merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion
In this article, we have learned about the Huawei Account Kit features of Log in via SMS and Forgot password? in Attendance Tracker app. The Log in via SMS is an alternative way of login with Huawei ID, instead of providing password user can enter SMS code from registered Phone Number. Forgot password? can be used when you forgot your password, you can reset the password using the Huawei ID and SMS code will be sent for verification.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference
Account Kit – Documentation
Account Kit – Training Video
Ads Kit – Documentation
Ads Kit – Training Video

Integration of Huawei Account Kit in Attendance Tracker Android app (Kotlin) - Part 1

MuraliAkula1 — Mon, 28 Feb 2022 06:31:48 +0000

Introduction
In this article, we can learn how to integrate the Huawei Account Kit of Obtaining Icon Resources feature in Attendance Tracker app. So, I will provide the series of articles on this Attendance Tracker App, in upcoming articles I will integrate other Huawei Kits.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signingReport, as follows.

Note: Project Name depends on the user created name.

Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android **Project **under **app **directory, as follows.
Enter SHA-256 certificate fingerprint and click **Save **button, as follows.
Click Manage APIs tab and enable Account Kit.
Add the below maven URL in build.gradle(Project) file under the repositories of buildscript, dependencies and allprojects, refer Add Configuration.
maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file.
apply plugin: id 'com.huawei.agconnect' // Huawei AGC implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300' // Huawei Account Kit implementation 'com.huawei.hms:hwid:6.3.0.301'
Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file.
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />

Let us move to development
I have created a project on Android studio with empty activity let us start coding.
In the MainActivity.kt we can find the business logic for login icon.
`class MainActivity : AppCompatActivity() {

lateinit var mAuthManager: AccountAuthService
private var mAuthParam: AccountAuthParams? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    btn_click.setOnClickListener(mOnClickListener)

}

private fun findResources() {
    mAuthParam = AccountAuthParamsHelper(AccountAuthParams.DEFAULT_AUTH_REQUEST_PARAM)
        .setIdToken()
        .setAccessToken()
        .setProfile()
        .createParams()
   mAuthManager = AccountAuthManager.getService(this@MainActivity, mAuthParam)
   startActivityForResult(mAuthManager?.signInIntent, 1002)
    // Obtain Icon steps
    val task : Task<AccountIcon> = mAuthManager.channel
    task.addOnSuccessListener { accountIcon ->
        // Obtain icon information
        Toast.makeText(this, "Display Name: " + accountIcon.description, Toast.LENGTH_LONG).show()
        // Log.i("TAG", "displayName:" + accountIcon.description)
    }
    task.addOnFailureListener { e ->
        // The information fails to be obtained.
        if (e is ApiException) {
            Log.i("TAG", "getChannelfailed status:" + e.statusCode)
        }
    }

}

private val mOnClickListener: View.OnClickListener = object : View.OnClickListener {
    override fun onClick(v: View?) {
        when (v?.id) {
            R.id.btn_click -> findResources()
        }
    }
}

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    if (requestCode == 1002 ) {
        val authAccountTask = AccountAuthManager.parseAuthResultFromIntent(data)
        if (authAccountTask.isSuccessful) {
            Toast.makeText(this, "SigIn success", Toast.LENGTH_LONG).show()
            val intent = Intent(this@MainActivity, Home::class.java)
            startActivity(intent)
        }
        else {
            Toast.makeText(this, "SignIn failed: " + (authAccountTask.exception as ApiException).statusCode, Toast.LENGTH_LONG).show()
        }
    }
}

<TextView
    android:id="@+id/main_title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="20dp"
    android:text="Welcome back! Login"
    android:textSize="28sp"
    android:textColor="@color/design_default_color_primary"
    android:textStyle="bold" />

<TextView
    android:id="@+id/txt_username"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="40dp"
    android:text=" Username"
    android:textColor="@color/black"
    android:textSize="16sp" />
<EditText
    android:id="@+id/edt_main_name"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="5dp"
    android:hint=" Enter your username"
    android:drawableLeft="@drawable/ic_baseline_person"
    android:drawablePadding="3dp"
    android:drawableTint="@color/design_default_color_primary"
    android:textSize="17sp" />

<TextView
    android:id="@+id/txt_password"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="20dp"
    android:text=" Password"
    android:textColor="@color/black"
    android:textSize="16sp" />
<EditText
    android:id="@+id/main_password"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="5dp"
    android:hint=" Enter your password"
    android:drawableTint="@color/design_default_color_primary"
    android:drawableLeft="@android:drawable/ic_lock_idle_lock"
    android:textSize="17sp" />
<TextView
    android:id="@+id/forgot_password"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="end"
    android:layout_marginEnd="35dp"
    android:textAlignment="textEnd"
    android:layout_marginTop="10dp"
    android:textColor="@color/black"
    android:text=" Forgot password?"
    android:textSize="16sp" />

<Button
    android:id="@+id/click_login"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="30dp"
    android:padding="5dp"
    android:textColor="@color/black"
    android:text="LOGIN" />

<TextView
    android:id="@+id/txt_signin"
    android:layout_width="300dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="40dp"
    android:textAlignment="center"
    android:layout_marginBottom="10dp"
    android:text=" Or SigIn Using"
    android:textColor="@color/black"
    android:drawablePadding="3dp"
    android:textSize="17sp" />
<ImageView
    android:id="@+id/btn_click"
    android:layout_width="50dp"
    android:layout_height="60dp"
    android:layout_gravity="center_horizontal"
    app:srcCompat="@drawable/hwid_auth_button_normal" />

Find the ic_baseline_person.xml for UI design.
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="24dp" android:height="24dp" android:viewportWidth="24" android:viewportHeight="24" android:tint="?attr/colorControlNormal"> <path android:fillColor="@android:color/white" android:pathData="M12,12c2.21,0 4,-1.79 4,-4s-1.79,-4 -4,-4 -4,1.79 -4,4 1.79,4 4,4zM12,14c-2.67,0 -8,1.34 -8,4v2h16v-2c0,-2.66 -5.33,-4 -8,-4z"/> </vector>

Demo

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get AndriodManifest merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion
In this article, we have learned how to integrate the Huawei Account Kit of Obtaining Icon Resources feature in Attendance Tracker app. So, I will provide the series of articles on this Attendance Tracker App, in upcoming articles will integrate other Huawei Kits.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference
Account Kit – Documentation
Account Kit – Training Video

Integration of Text to Speech feature of Huawei ML Kit in Book Reading Android app (Kotlin) - Part 4

MuraliAkula1 — Mon, 21 Feb 2022 08:51:13 +0000

Introduction
In this article, we can learn how to integrate the Text to Speech feature of Huawei ML Kit in Book Reading app. Text to speech (TTS) can convert text information into human voice in real time. This service uses Deep Neural Networks in order to process the text and create a natural sound, rich timbers are also supported to enhance the result. TTS is widely used in broadcasting, news, voice navigation, and audio reading. For example, TTS can convert a large amount of text into speech output and highlight the content that is being played to free users eyes, bringing interests to users. TTS records a voice segment based on navigation data, and then synthesizes the voice segment into navigation voice, so that navigation is more personalized.

Precautions

The text in a single request can contain a maximum of 500 characters and is encoded using UTF-8.
Currently, TTS in French, Spanish, German, Italian, Russian, Thai, Malay, and Polish is deployed only in China, Asia, Africa, Latin America, and Europe.
TTS depends on on-cloud APIs. During commissioning and usage, ensure that the device can access the Internet.
Default specifications of the real-time output audio data are as follows: MP3 mono, 16-bit depth, and 16 kHz audio sampling rate.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signingReport, as follows.

Note: Project Name depends on the user created name.

Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android Project **under **app directory, as follows.

Enter SHA-256 certificate fingerprint and click **Save **button, as follows.

Click Manage APIs tab and enable ML Kit.

Add the below maven URL in build.gradle(Project) file under the repositories of b*uildscript, dependencies* and allprojects, refer Add Configuration. maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file. `apply plugin: id 'com.huawei.agconnect'

dataBinding {
enabled = true
}

// Huawei AGC
implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300'
// ML Kit - Text to Speech
implementation 'com.huawei.hms:ml-computer-voice-tts:3.3.0.305'
// Data Binding
implementation 'androidx.databinding:databinding-runtime:7.1.1'
`

Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file. <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.INTERNET" />

Let us move to development
I have created a project on Android studio with empty activity let us start coding.
In the ListActivity.kt to find the button click.
`class ListActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_list)

    btn_voice.setOnClickListener {
        val intent = Intent(this@ListActivity, TranslateActivity::class.java)
        startActivity(intent)
    }

}

In the TranslateActivity.kt to find the business logic for text translation.
`class TranslateActivity : AppCompatActivity() {

private lateinit var binding: ActivityTranslateBinding
private lateinit var ttsViewModel: TtsViewModel
private var sourceText: String = ""
private lateinit var mlTtsEngine: MLTtsEngine
private lateinit var mlConfigs: MLTtsConfig
private val TAG: String = TranslateActivity::class.java.simpleName
private var callback: MLTtsCallback = object : MLTtsCallback {
    override fun onError(taskId: String, err: MLTtsError) {
    }
    override fun onWarn(taskId: String, warn: MLTtsWarn) {
    }
    override fun onRangeStart(taskId: String, start: Int, end: Int) {
        Log.d("", start.toString())
        img_view.setImageResource(R.drawable.on)
    }
    override fun onAudioAvailable(p0: String?, p1: MLTtsAudioFragment?, p2: Int, p3: android.util.Pair<Int, Int>?, p4: Bundle?) {
    }
    override fun onEvent(taskId: String, eventName: Int, bundle: Bundle?) {
        if (eventName == MLTtsConstants.EVENT_PLAY_STOP) {
            Toast.makeText(applicationContext, "Service Stopped", Toast.LENGTH_LONG).show()
        }
        img_view.setImageResource(R.drawable.off)
    }
}

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(activity_translate)

    binding = setContentView(this, activity_translate)
    binding.lifecycleOwner = this
    ttsViewModel = ViewModelProvider(this).get(TtsViewModel::class.java)
    binding.ttsViewModel = ttsViewModel
    setApiKey()
    supportActionBar?.title = "Text to Speech Conversion"
    ttsViewModel.ttsService.observe(this, Observer {
        startTtsService()
    })
    ttsViewModel.textData.observe(this, Observer {
        sourceText = it
    })

}

private fun startTtsService() {
    mlConfigs = MLTtsConfig()
        .setLanguage(MLTtsConstants.TTS_EN_US)
        .setPerson(MLTtsConstants.TTS_SPEAKER_FEMALE_EN)
        .setSpeed(1.0f)
        .setVolume(1.0f)
    mlTtsEngine = MLTtsEngine(mlConfigs)
    mlTtsEngine.setTtsCallback(callback)
    // ID to use for Audio Visualizer.
    val id = mlTtsEngine.speak(sourceText, MLTtsEngine.QUEUE_APPEND)
    Log.i(TAG, id)
}

private fun setApiKey(){
    MLApplication.getInstance().apiKey = "DAEDAOB+zyB7ajg1LGcp8F65qxZduDjQ1E6tVovUp4lU/PywqhT4g+bxBCtStYAa33V9tUQrKvUp89m+0Gi/fPwfNN6WCJxcVLA+WA=="
}

override fun onDestroy() {
    super.onDestroy()
    mlTtsEngine.shutdown()
}
override fun onPause() {
    super.onPause()
    mlTtsEngine.stop()
}

In the activity_list.xml we can create the UI screen.
`<?xml version="1.0" encoding="utf-8"?>
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:orientation="vertical"
android:paddingTop="10dp"
android:paddingBottom="10dp"
tools:context=".ListActivity">

    android:id="@+id/btn_voice"
    android:layout_width="310dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="50dp"
    android:textAlignment="center"
    android:layout_gravity="center_horizontal"
    android:textSize="20sp"
    android:textColor="@color/black"
    android:padding="8dp"
    android:textAllCaps="false"
    android:text="Text to Voice" />

In the activity_translate.xml we can create the UI screen.
`<?xml version="1.0" encoding="utf-8"?>
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools">

<data>
    <variable
        name="ttsViewModel"
        type="com.example.huaweibookreaderapp1.TtsViewModel" />
</data>

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    tools:context=".TranslateActivity">

    <Button
        android:id="@+id/btn_click"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="@{() -> ttsViewModel.callTtsService()}"
        android:text="@string/speak"
        android:textSize="20sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.43" />
    <EditText
        android:id="@+id/edt_text"
        android:layout_width="409dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="36dp"
        android:ems="10"
        android:textSize="20sp"
        android:hint="@string/enter_text_here"
        android:inputType="textPersonName"
        android:onTextChanged="@{ttsViewModel.noDataChangedText}"
        android:paddingStart="70dp"
        app:layout_constraintBottom_toTopOf="@+id/btn_click"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent"
        android:autofillHints="@string/enter_text_here" />
    <ImageView
        android:id="@+id/img_view"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginTop="7dp"
        app:layout_constraintBottom_toTopOf="@+id/edt_text"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.8"
        app:srcCompat="@drawable/off"
        android:contentDescription="@string/speaker" />
</androidx.constraintlayout.widget.ConstraintLayout>

Demo

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get AndriodManifest merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion
In this article, we have learned how to integrate the Text to Speech feature of Huawei ML Kit in Book Reading app. Text to speech (TTS) can convert text information into human voice in real time. This service uses Deep Neural Networks in order to process the text and create a natural sound, rich timbers are also supported to enhance the result.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference
ML Kit – Text to Speech
ML Kit – Training Video

Integration of Huawei Push Kit in Book Reading Android app (Kotlin) - Part 3

MuraliAkula1 — Mon, 14 Feb 2022 10:54:43 +0000

Introduction
In this article, we can learn how to integrate the Huawei Push Kit in Book Reading app to send the push message notification to users phone from the AppGallery Connect. Push notifications offers a great way to increase your application’s user engagement and boost your retention rates by sending meaningful messages or by informing users about your application. These messages can be sent at any time and even if your app is not running at that time. So, I will provide the series of articles on this Book Reading App, in upcoming articles I will integrate other Huawei Kits.

Push Kit
Huawei Push Kit is a messaging service developed by Huawei for developers to send messages to apps on users’ device in real time. Push Kit supports two types of messages: notification messages and data messages. You can send notifications and data messages to your users from your server using the Push Kit APIs or directly from the AppGallery Push Kit Console.

AppGallery Connect
Find the Push Kit message service in AppGallery connect dashboard.
Choose My Projects > Grow > Push Kit, and click Enable now.

Follow the steps to send the notification message to device from AppGallery Connect, Sending a Notification Message.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signingReport, as follows.

Note: Project Name depends on the user created name.

Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android **Project **under **app **directory, as follows.

Enter SHA-256 certificate fingerprint and click **Save **button, as follows.

Click Manage APIs tab and enable Push Kit.

Add the below maven URL in build.gradle(Project) file under the repositories of buildscript, dependencies and allprojects, refer Add Configuration. maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file. apply plugin: id 'com.huawei.agconnect' // Huawei AGC implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300' // Huawei Push Kit implementation 'com.huawei.hms:push:6.3.0.302' // PDF Viewer implementation 'com.github.barteksc:android-pdf-viewer:2.8.2'
Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file. // Push Kit <uses-permission android:name="android.permission.INTERNET" /> <service android:name=".PushService" android:exported="false"> <intent-filter> <action android:name="com.huawei.push.action.MESSAGING_EVENT" /> </intent-filter> </service>

Let us move to development
I have created a project on Android studio with empty activity let us start coding.
In the WebViewActivity.kt to find the web view of pdf document.
`class WebViewActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_web_view)

    webView.webViewClient = WebViewClient()
    webView.settings.setSupportZoom(true)
    webView.settings.javaScriptEnabled = true
     val url = getPdfUrl()        webView.loadUrl("https://docs.google.com/gview?embedded=true&url=$url")

}

companion object{
    fun getPdfUrl(): String {
        return "https://mindorks.s3.ap-south-1.amazonaws.com/courses/MindOrks_Android_Online_Professional_Course-Syllabus.pdf"
    }
}

}Create **PushService.kt** class to send the push notification to device.class PushService : HmsMessageService() {

 // When an app calls the getToken method to apply for a token from the server,
 // if the server does not return the token during current method calling, the server can return the token through this method later.
 // This method callback must be completed in 10 seconds. Otherwise, you need to start a new Job for callback processing.
 // @param token token
override fun onNewToken(token: String?) {
    Log.i(TAG, "received refresh token:$token")
    // send the token to your app server.
    if (!token.isNullOrEmpty()) {
        // This method callback must be completed in 10 seconds. Otherwise, you need to start a new Job for callback processing.
        refreshedTokenToServer(token)
    }
    val intent = Intent()
    intent.action = CODELABS_ACTION
    intent.putExtra("method", "onNewToken")
    intent.putExtra("msg", "onNewToken called, token: $token")
    sendBroadcast(intent)
}

private fun refreshedTokenToServer(token: String) {
    Log.i(TAG, "sending token to server. token:$token")
}

 // This method is used to receive downstream data messages.
 // This method callback must be completed in 10 seconds. Otherwise, you need to start a new Job for callback processing.
 // @param message RemoteMessage
override fun onMessageReceived(message: RemoteMessage?) {
    Log.i(TAG, "onMessageReceived is called")
    if (message == null) {
        Log.e(TAG, "Received message entity is null!")
        return
    }
    // getCollapseKey() Obtains the classification identifier (collapse key) of a message.
    // getData() Obtains valid content data of a message.
    // getMessageId() Obtains the ID of a message.
    // getMessageType() Obtains the type of a message.
    // getNotification() Obtains the notification data instance from a message.
    // getOriginalUrgency() Obtains the original priority of a message.
    // getSentTime() Obtains the time when a message is sent from the server.
    // getTo() Obtains the recipient of a message.
    Log.i(TAG, """getCollapseKey: ${message.collapseKey}
        getData: ${message.data}
        getFrom: ${message.from}
        getTo: ${message.to}
        getMessageId: ${message.messageId}
        getMessageType: ${message.messageType}
        getSendTime: ${message.sentTime}
        getTtl: ${message.ttl}
        getSendMode: ${message.sendMode}
        getReceiptMode: ${message.receiptMode}
        getOriginalUrgency: ${message.originalUrgency}
        getUrgency: ${message.urgency}
        getToken: ${message.token}""".trimIndent())
    // getBody() Obtains the displayed content of a message
    // getTitle() Obtains the title of a message
    // getTitleLocalizationKey() Obtains the key of the displayed title of a notification message
    // getTitleLocalizationArgs() Obtains variable parameters of the displayed title of a message
    // getBodyLocalizationKey() Obtains the key of the displayed content of a message
    // getBodyLocalizationArgs() Obtains variable parameters of the displayed content of a message
    // getIcon() Obtains icons from a message
    // getSound() Obtains the sound from a message
    // getTag() Obtains the tag from a message for message overwriting
    // getColor() Obtains the colors of icons in a message
    // getClickAction() Obtains actions triggered by message tapping
    // getChannelId() Obtains IDs of channels that support the display of messages
    // getImageUrl() Obtains the image URL from a message
    // getLink() Obtains the URL to be accessed from a message
    // getNotifyId() Obtains the unique ID of a message
    val notification = message.notification
    if (notification != null) {
        Log.i(TAG, """
            getTitle: ${notification.title}
            getTitleLocalizationKey: ${notification.titleLocalizationKey}
            getTitleLocalizationArgs: ${Arrays.toString(notification.titleLocalizationArgs)}
            getBody: ${notification.body}
            getBodyLocalizationKey: ${notification.bodyLocalizationKey}
            getBodyLocalizationArgs: ${Arrays.toString(notification.bodyLocalizationArgs)}
            getIcon: ${notification.icon}                
            getImageUrl: ${notification.imageUrl}
            getSound: ${notification.sound}
            getTag: ${notification.tag}
            getColor: ${notification.color}
            getClickAction: ${notification.clickAction}
            getIntentUri: ${notification.intentUri}
            getChannelId: ${notification.channelId}
            getLink: ${notification.link}
            getNotifyId: ${notification.notifyId}
            isDefaultLight: ${notification.isDefaultLight}
            isDefaultSound: ${notification.isDefaultSound}
            isDefaultVibrate: ${notification.isDefaultVibrate}
            getWhen: ${notification.`when`}
            getLightSettings: ${Arrays.toString(notification.lightSettings)}
            isLocalOnly: ${notification.isLocalOnly}
            getBadgeNumber: ${notification.badgeNumber}
            isAutoCancel: ${notification.isAutoCancel}
            getImportance: ${notification.importance}
            getTicker: ${notification.ticker}
            getVibrateConfig: ${notification.vibrateConfig}
            getVisibility: ${notification.visibility}""".trimIndent())
        showNotification(notification.title,notification.body)
    }
    val intent = Intent()
    intent.action = CODELABS_ACTION
    intent.putExtra("method", "onMessageReceived")
    intent.putExtra("msg", "onMessageReceived called, message id:" + message.messageId + ", payload data:" + message.data)
    sendBroadcast(intent)
    val judgeWhetherIn10s = false
    // If the messages are not processed in 10 seconds, the app needs to use WorkManager for processing.
    if (judgeWhetherIn10s) {
        startWorkManagerJob(message)
    } else {
        // Process message within 10s
        processWithin10s(message)
    }
}

private fun showNotification(title: String?, body: String?) {
    val intent = Intent(this, WebViewActivity::class.java)
    intent.putExtra("URL", "Provide link here")
    intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)
    val pendingIntent = PendingIntent.getActivity(this, 0, intent, PendingIntent.FLAG_ONE_SHOT)
    val soundUri = RingtoneManager.getDefaultUri(RingtoneManager.TYPE_NOTIFICATION)
    val notificationBuilder = NotificationCompat.Builder(this)
        .setSmallIcon(R.drawable.sym_def_app_icon)
        .setContentTitle(title)
        .setContentText(body)
        .setAutoCancel(true)
        .setSound(soundUri)
        .setContentIntent(pendingIntent)
    val notificationManager = getSystemService(Context.NOTIFICATION_SERVICE) as NotificationManager
    notificationManager.notify(0, notificationBuilder.build())
}

private fun startWorkManagerJob(message: RemoteMessage?) {
    Log.d(TAG, "Start new Job processing.")
}

private fun processWithin10s(message: RemoteMessage?) {
    Log.d(TAG, "Processing now.")
}

override fun onMessageSent(msgId: String?) {
    Log.i(TAG, "onMessageSent called, Message id:$msgId")
    val intent = Intent()
    intent.action = CODELABS_ACTION
    intent.putExtra("method", "onMessageSent")
    intent.putExtra("msg", "onMessageSent called, Message id:$msgId")
    sendBroadcast(intent)
}

override fun onSendError(msgId: String?, exception: Exception?) {
    Log.i(TAG, "onSendError called, message id:$msgId, ErrCode:${(exception as SendException).errorCode}, " +
          "description:${exception.message}")
    val intent = Intent()
    intent.action = CODELABS_ACTION
    intent.putExtra("method", "onSendError")
    intent.putExtra("msg", "onSendError called, message id:$msgId, ErrCode:${exception.errorCode}, " +
                    "description:${exception.message}")
    sendBroadcast(intent)
}

override fun onTokenError(e: Exception) {
    super.onTokenError(e)
}

private fun getToken() {
showLog("getToken:begin")
object : Thread() {
override fun run() {
try {
// read from agconnect-services.json
val appId = "Your app id"
val token = HmsInstanceId.getInstance(this@MainActivity).getToken(appId, "HCM")
Log.i(TAG, "get token:$token")
if (!TextUtils.isEmpty(token)) {
sendRegTokenToServer(token)
}
showLog("get token:$token")
} catch (e: ApiException) {
Log.e(TAG, "get token failed, $e")
showLog("get token failed, $e")
}
}
}.start()
}

fun showLog(log: String?) {
runOnUiThread {
val tvView = findViewById(R.id.tv_log)
val svView = findViewById(R.id.sv_log)
if (tvView is TextView) {
tvView.text = log
}
if (svView is ScrollView) {
svView.fullScroll(View.FOCUS_DOWN)
}
}
}

private fun sendRegTokenToServer(token: String?) {
Log.i(TAG, "sending token to server. token:$token")
}

companion object {
    private const val TAG: String = "PushDemoLog"
    private const val CODELABS_ACTION: String = "com.huawei.codelabpush.action"
}

}In the **activity_web_view.xml** we can create the UI screen.<?xml version="1.0" encoding="utf-8"?>
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=".WebViewActivity">

<WebView
    android:id="@+id/webView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

In the **log_layout.xml** we can create the UI screen.<?xml version="1.0" encoding="utf-8"?>
android:overScrollMode="never"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
android:id="@+id/tv_log"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
`

Demo

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get AndriodManifest merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion
In this article, we have learned how to integrate the Huawei Push Kit in Book Reading app to send the push message notification to users’ phone from the AppGallery Connect. Push notifications offers a great way to increase your application’s user engagement and boost your retention rates by sending meaningful messages or by informing users about your application. These messages can be sent at any time and even if your app is not running at that time.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference
Push Kit – Document
Push Kit – Training Video

Integration of Huawei Analytics Kit and Ads Kit in Book Reading Android app (Kotlin) - Part 2

MuraliAkula1 — Tue, 08 Feb 2022 07:27:39 +0000

Introduction
In this article, we can learn how to integrate the Huawei Analytics Kit and Ads Kit in Book Reading app. So, I will provide the series of articles on this Book Reading App, in upcoming articles I will integrate other Huawei Kits.

Analytics Kit
HUAWEI Analytics Kit provides analysis models to understand user behaviour and gain in-depth insights into users, products **and **content. It helps you to gain insight about user behaviour on different platforms based on the user behaviour events and user attributes reported by through apps.

AppGallery Connect
Find the Analytics using AppGallery connect dashboard.
Choose My Projects > Huawei Analytics > Overview > Project overview.
Project overview displays the core indicators of current project, such as the number of new users, User activity, User acquisition, User revisit, New user retention, Active user retention, User characteristics and Popular pages etc. providing a quick overview of the users and how they are using your app.

Ads Kit
Huawei Ads provides to developers a wide-ranging capabilities to deliver good quality ads content to users. This is the best way to reach target audience easily and can measure user productivity. It is very useful when we publish a free app and want to earn some money from it.

HMS Ads Kit has 7 types of Ads kits. Now we can implement Interstitial Ads in this application.

Interstitial ads are full-screen ads that cover the interface of an app. Such an ad is displayed when a user starts, pauses **or **exits an app, without disrupting the user's experience.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signing Report, as follows.
Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android **Project **under **app **directory, as follows.
Enter SHA-256 certificate fingerprint and click **Save **button, as follows.
Click Manage APIs tab and enable HUAWEI Analytics.
Add the below maven URL in build.gradle(Project) file under the repositories of buildscript, dependencies **and **allprojects, refer Add Configuration.
maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file.
apply plugin: id 'com.huawei.agconnect' // Huawei AGC implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300' // Huawei Analytics Kit implementation 'com.huawei.hms:hianalytics:6.4.0.300' // Huawei Ads Kit implementation 'com.huawei.hms:ads-lite:13.4.51.300'
Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file
.// Analytics Kit <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="com.huawei.appmarket.service.commondata.permission.GET_COMMON_DATA" />

Let us move to development
I have created a project on Android studio with empty activity let us start coding.

In the MainActivity.kt we can find the business logic for Analytics.
`class MainActivity : AppCompatActivity() {

// Initialize the Analytics
var  mInstance: HiAnalyticsInstance? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    sign_btn.setOnClickListener(mOnClickListener)
    // Initialize the Analytics function
    initAna()

}

private fun initAna() {
// Enable Analytics Kit Log
HiAnalyticsTools.enableLog()
// Generate the Analytics Instance
mInstance = HiAnalytics.getInstance(this)
// Enable collection capability
mInstance?.setAnalyticsEnabled(true)
}

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    if (requestCode == 1002 ) {
        val authAccountTask = AccountAuthManager.parseAuthResultFromIntent(data)
        if (authAccountTask.isSuccessful) {

            // Analytics data to send custom events
            val bundle = Bundle()
            bundle.putString("email", data!!.extras!!.getString("email" ))
            bundle.putString("name", data.extras!!.getString("name"))
            bundle.putString("phone", data!!.extras!!.getInt("phone").toString())
            bundle.putString("marks", data!!.extras!!.getFloat("86.5").toString())
            mInstance!!.onEvent(HAEventType.SIGNIN, bundle)

            Toast.makeText(this, "SigIn success", Toast.LENGTH_LONG).show()
        } else {
            Toast.makeText(this, "SignIn failed: " + (authAccountTask.exception as ApiException).statusCode, Toast.LENGTH_LONG).show()
        }
    }
}

In the ListActivity.kt we can find the business logic for Ads.
`class ListActivity : AppCompatActivity() {

// Initialize the Interstitial Ads Kit
private var interstitialAd: InterstitialAd? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_list)

   title = getString(R.string.interstitial_ad)
    btn_alltypes.setOnClickListener {
        loadInterstitialAd()
    }

    showInterstitialAd()
    val actionBar = supportActionBar
    actionBar!!.setDisplayHomeAsUpEnabled(true)
}

private val adListener: AdListener = object : AdListener() {
    override fun onAdLoaded() {
        super.onAdLoaded()
        showToast("Ad loaded")
        // Display an interstitial ad.
        showInterstitialAd()
        val intent = Intent(this@ListActivity, Home::class.java)
        startActivity(intent)
    }
    override fun onAdFailed(errorCode: Int) {
        showToast("Ad load failed with error code: $errorCode")
        Log.d(TAG, "Ad load failed with error code: $errorCode")
        val intent = Intent(this@ListActivity, Home::class.java)
        startActivity(intent)
    }
    override fun onAdClosed() {
        super.onAdClosed()
        showToast("Ad closed")
        Log.d(TAG, "onAdClosed")
        val intent = Intent(this@ListActivity, Home::class.java)
        startActivity(intent)
    }
    override fun onAdClicked() {
        Log.d(TAG, "onAdClicked")
        super.onAdClicked()
    }
    override fun onAdOpened() {
        Log.d(TAG, "onAdOpened")
        super.onAdOpened()
    }
    override fun onAdLeave() {
        Log.d(TAG, "onAdLeaves")
        super.onAdLeave()
    }
}

private fun loadInterstitialAd() {
    // Load an interstitial ad.
    interstitialAd = InterstitialAd(this)
    val adParam = AdParam.Builder().build()
    interstitialAd!!.adId = getString(R.string.video_ad_id)
    interstitialAd!!.loadAd(adParam)
    interstitialAd!!.adListener = adListener
}

private val adId: String
    get() = if (btn_alltypes.isClickable) {
        getString(R.string.image_ad_id)
    } else {
        getString(R.string.video_ad_id)
    }

private fun showInterstitialAd() {
    // Display the ad
    if (interstitialAd != null && interstitialAd!!.isLoaded) {
        interstitialAd!!.show(this)
    } else {
        Toast.makeText(this, "Ad did not load", Toast.LENGTH_LONG).show()
    }
}

private fun showToast(text: String) {
    runOnUiThread {
        Toast.makeText(this@ListActivity, text, Toast.LENGTH_LONG).show()
    }
}

companion object {
    private val TAG = ListActivity::class.java.simpleName
}

override fun onSupportNavigateUp(): Boolean {
    finish()
    return super.onSupportNavigateUp()
}

<ImageButton
    android:id="@+id/sign_btn"
    android:layout_width="290dp"
    android:layout_height="60dp"
    android:layout_alignParentBottom="true"
    android:layout_centerInParent="true"
    android:layout_margin="15dp"
    android:paddingTop="10dp"
    app:srcCompat="@drawable/huawei_id_buttons" />

<Button
    android:id="@+id/btn_alltypes"
    android:layout_width="310dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="70dp"
    android:textAlignment="center"
    android:layout_gravity="center_horizontal"
    android:textSize="20sp"
    android:textColor="@color/black"
    android:padding="10dp"
    android:textAllCaps="false"
    android:text="Types of Books" />

Demo

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get AndriodManifest merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion
In this article, we have learned how to integrate the Huawei Analytics Kit and Ads Kit in Book Reading app. So, I will provide the series of articles on this Book Reading App, in upcoming articles will integrate other Huawei Kits.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference
Analytics Kit
Ads Kit - Interstitial Ads

Integration of Huawei Account Kit in Book Reading Android app (Kotlin) - Part 1

MuraliAkula1 — Fri, 04 Feb 2022 04:53:09 +0000

Introduction

In this article, we can learn how to integrate the Huawei Account Kit in Book Reading app. So, I will provide the series of articles on this Book Reading App, in upcoming articles I will integrate other Huawei Kits.

Account Kit

Huawei Account Kit provides for developers with simple, secure, and quick sign-in and authorization functions. User is not required to enter accounts, passwords and waiting for authorization. User can click on Sign In with HUAWEI ID button to quickly and securely sign in to the app.

Requirements

Any operating system (MacOS, Linux and Windows).
Must have a Huawei phone with HMS 4.0.0.300 or later.
Must have a laptop or desktop with Android Studio, Jdk 1.8, SDK platform 26 and Gradle 4.6 and above installed.
Minimum API Level 24 is required.
Required EMUI 9.0.0 and later version devices.

How to integrate HMS Dependencies

First register as Huawei developer and complete identity verification in Huawei developers website, refer to register a Huawei ID.
Create a project in android studio, refer Creating an Android Studio Project.
Generate a SHA-256 certificate fingerprint.
To generate SHA-256 certificate fingerprint. On right-upper corner of android project click Gradle, choose Project Name > Tasks > android, and then click signingReport, as follows.

Create an App in AppGallery Connect.
Download the agconnect-services.json file from App information, copy and paste in android **Project **under **app **directory, as follows.

Enter SHA-256 certificate fingerprint and click **Save **button, as follows.

Click Manage APIs tab and enable Account Kit.

Add the below maven URL in build.gradle(Project) file under the repositories of buildscript, dependencies and allprojects, refer Add Configuration. maven { url 'http://developer.huawei.com/repo/' } classpath 'com.huawei.agconnect:agcp:1.6.0.300'
Add the below plugin and dependencies in build.gradle(Module) file. apply plugin: id 'com.huawei.agconnect' // Huawei AGC implementation 'com.huawei.agconnect:agconnect-core:1.6.0.300' // Huawei Account Kit implementation 'com.huawei.hms:hwid:6.3.0.301' implementation 'androidx.recyclerview:recyclerview:1.2.1'
Now Sync the gradle.
Add the required permission to the AndroidManifest.xml file. <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />

Let us move to development

I have created a project on Android studio with empty activity let us start coding.

In the MainActivity.kt we can find the business logic.

`class MainActivity : AppCompatActivity() {

private var mAuthManager: AccountAuthService? = null
private var mAuthParam: AccountAuthParams? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    sign_btn.setOnClickListener(mOnClickListener)

}

private fun signIn() {
    mAuthParam = AccountAuthParamsHelper(AccountAuthParams.DEFAULT_AUTH_REQUEST_PARAM)
        .setIdToken()
        .setAccessToken()
        .setProfile()
        .createParams()
    mAuthManager = AccountAuthManager.getService(this@MainActivity, mAuthParam)
    startActivityForResult(mAuthManager?.signInIntent, 1002)
}

private val mOnClickListener: View.OnClickListener = object : View.OnClickListener {
    override fun onClick(v: View?) {
        when (v?.id) {
            R.id.sign_btn -> signIn()
        }
    }
}

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    if (requestCode == 1002 ) {
        val authAccountTask = AccountAuthManager.parseAuthResultFromIntent(data)
        if (authAccountTask.isSuccessful) {
            Toast.makeText(this, "SigIn success", Toast.LENGTH_LONG).show()
            val intent = Intent(this@MainActivity, Home::class.java)
            startActivity(intent)
        } else {
            Toast.makeText(this, "SignIn failed: " + (authAccountTask.exception as ApiException).statusCode, Toast.LENGTH_LONG).show()
        }
    }
}

}`
In the Home.kt we can find the business logic.

`class Home : AppCompatActivity() {

lateinit var recyclerView: RecyclerView
var mBookAdapter: BookAdapter? = null

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_home)

    recyclerView = findViewById(R.id.recycler_view)
    mBookAdapter = BookAdapter()
    recyclerView.adapter = mBookAdapter

}

Create BookAdapter.kt class for holding the list.

`class BookAdapter(): RecyclerView.Adapter() {

private var titles = arrayOf("Life", "Young Adult", "Comedy", "Women", "Tragedy", "Science Fiction",
                             "Horror Stories", "Drama", "Society", "Biography")
private var images = intArrayOf(R.drawable.life, R.drawable.youth, R.drawable.comedy, R.drawable.women,
                                R.drawable.tragedy, R.drawable.science, R.drawable.horror, R.drawable.drama,
                                R.drawable.society, R.drawable.biography)

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): BookAdapter.ViewHolder {
    val view = LayoutInflater.from(parent.context)
        .inflate(R.layout.list_item, parent, false)
    return BookAdapter.ViewHolder(view)
}

override fun onBindViewHolder(holder: BookAdapter.ViewHolder, position: Int) {
    holder.itemTitle.text = titles[position]
    holder.itemImage.setImageResource(images[position])
}

override fun getItemCount(): Int {
    return titles.size
}

class ViewHolder(ItemView: View) : RecyclerView.ViewHolder(ItemView) {
    var itemTitle: TextView = itemView.findViewById(R.id.titles)
    var itemImage: ImageView = itemView.findViewById(R.id.images)
}

In the activity_main.xml we can create the UI screen.

`<?xml version="1.0" encoding="utf-8"?>
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:orientation="vertical"
android:background="@drawable/book_fly"
tools:context=".MainActivity">

<TextView
    android:id="@+id/act_main_title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="left"
    android:layout_marginLeft="20dp"
    android:layout_marginTop="30dp"
    android:text="Huawei E-Book Store"
    android:textSize="32sp"
    android:textColor="@color/hwid_auth_button_color_red"
    android:textStyle="bold" />

<ImageButton
    android:id="@+id/sign_btn"
    android:layout_width="290dp"
    android:layout_height="60dp"
    android:layout_alignParentBottom="true"
    android:layout_centerInParent="true"
    android:layout_margin="15dp"
    android:paddingTop="10dp"
    app:srcCompat="@drawable/huawei_id_buttons" />

In the activity_home.xml we can create the UI screen.

`<?xml version="1.0" encoding="utf-8"?>
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:gravity="center_vertical"
android:orientation="vertical"
android:paddingLeft="8dp"
android:paddingRight="8dp"
tools:context=".Home">

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
    android:layout_height="match_parent" />

In the list_item.xml we can create the list of items.

`<?xml version="1.0" encoding="utf-8"?>
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/list_view"
android:layout_marginLeft="-3dp"
android:layout_marginRight="0dp"
android:layout_marginBottom="5dp"
app:cardBackgroundColor="@color/hwid_auth_button_color_border"
app:cardCornerRadius="8dp"
app:cardElevation="3dp"
app:contentPadding="5dp">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="5dp">
    <TextView
        android:id="@+id/titles"
        android:layout_width="160dp"
        android:layout_height="50dp"
        android:layout_marginStart="10dp"
        android:layout_marginLeft="15dp"
        android:text="Item"
        android:textSize="20sp"
        android:textAlignment="viewStart"
        android:textColor="@color/black"
        android:textStyle="bold" />
    <ImageView
        android:id="@+id/images"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_gravity="right"
        android:layout_marginLeft="55dp" />
</LinearLayout>

Demo

Tips and Tricks

Make sure you are already registered as Huawei developer.
Set minSDK version to 24 or later, otherwise you will get **AndriodManifest **merge issue.
Make sure you have added the agconnect-services.json file to app folder.
Make sure you have added SHA-256 fingerprint without fail.
Make sure all the dependencies are added properly.

Conclusion

In this article, we have learned how to integrate the Huawei Account Kit in Book Reading app. So, I will provide the series of articles on this Book Reading App, in upcoming articles will integrate other Huawei Kits.

I hope you have read this article. If you found it is helpful, please provide likes and comments.

Reference

Account Kit