お金の管理のAndroidアプリ(Kotlin)の導入スライダーとHuaweiアカウントキットの統合-パート1

導入
この記事では、導入のスライドと一緒にマネー管理アプリでHuaweiアカウントキットを統合する方法を学ぶことができます.スライダは、アプリケーションの機能の簡単なビューを提供します.だから、私はこのお金の管理アプリには、今後の記事では、他のHuaweiキットを統合する記事のシリーズを提供します.
アカウントキット
Huaweiアカウントキットは、シンプルで安全な、迅速なサインインと認証機能を開発者を提供します.ユーザーアカウント、パスワードを入力し、承認を待っている必要はありません.ユーザーは、迅速かつ安全にアプリケーションに署名するHuawei IDボタンでサインインをクリックすることができます.
要件

オペレーティングシステム(MacOS、Linux、Windows).

はHMS 4.0.0.300以降でHuawei電話を持たなければなりません.

は、Android Studio、JDK 1.8、SDKプラットフォーム26とGradle 4.6を搭載したラップトップまたはデスクトップを持っていなければなりません.

最小APIレベル24が必要です.

EMUI 9.0.0以降のバージョンデバイスが必要です.

HMS依存関係を統合する方法

はHuawei開発者として登録され、Huawei開発者ウェブサイトで完全なアイデンティティ検証を行う.

Android Studioでプロジェクトを作成します.

SHA - 256証明書指紋を生成します.

SHA - 256証明書指紋を生成する

.Android Project Class Gradleの右上隅に、「プロジェクト名」「タスク」「Android」を選択し、「次へ」をクリックします.

注意:プロジェクト名は、ユーザーが作成した名前によって異なります.

Huawei ID .

AppConnectサービスをダウンロードします.JSONファイルのアプリ情報、コピーと貼り付けアプリのディレクトリの下にAndroidのプロジェクトでは、次のように.
Creating an Android Studio Project

SHA - 256証明書指紋を入力し、保存ボタンをクリックします.
Create an App in AppGallery Connect

注意:ステップ1から7までの上記の手順は、すべてのHuaweiキットのために一般的です.

管理タブをクリックし、アカウントキットを有効にします.

ビルド中のMaven URLを追加します.buildScript、依存関係、およびすべてのプロジェクトのリポジトリの下にあるGradleプロジェクト.

maven { url 'http://developer.huawei.com/repo/' }
classpath 'com.huawei.agconnect:agcp:1.6.0.300'

ビルドでプラグインと依存関係を追加します.gradle ( module )ファイル.

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'

今Gradleを同期します.

AndroidManifestに必要なアクセス許可を追加します.XMLファイル.

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />

発展に移ろう
私は、私たちがコーディングを始めさせようとしていない空の活動でAndroid Studioでプロジェクトを作成しました.
メインアクティビティで.KTはHuaweiログインボタンのビジネスロジックを見つけることができますまた、導入スライド.

class MainActivity : AppCompatActivity() {

    private var viewPager: ViewPager? = null
    private var viewPagerAdapter: ViewPagerAdapter? = null
    private lateinit var dots: Array<TextView?>
    private var dotsLayout: LinearLayout? = null
    companion object {
        private lateinit var layouts: IntArray
    }

    // Account Kit variables
    private var mAuthManager: AccountAuthService? = null
    private var mAuthParam: AccountAuthParams? = null

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

        viewPager = findViewById(R.id.view_pager)
        dotsLayout= findViewById(R.id.layoutDots)
        // Introduction slides, create xml files under "app > res > layout"
        layouts = intArrayOf(R.layout.slider_1, R.layout.slider_2, R.layout.slider_3,R.layout.slider_4)
        addBottomDots(0)
        // Making notification bar transparent
        changeStatusBarColor()
        viewPagerAdapter = ViewPagerAdapter()
        viewPager!!.adapter = viewPagerAdapter
        viewPager!!.addOnPageChangeListener(viewListener)

        // For the next and previous buttons
        btn_skip.setOnClickListener { view ->
            val intent = Intent(this@MainActivity, Home::class.java)
            startActivity(intent)
            finish()
        }
        btn_next.setOnClickListener { view ->
            val current: Int = getItem(+1)
            if (current < layouts.size) {
                // Move to another slide
                viewPager!!.currentItem = current
            } else {
                val i = Intent(this@MainActivity, Home::class.java)
                startActivity(i)
                finish()
            }
        }

        // Account kit button click Listener
        btn_login.setOnClickListener(mOnClickListener)

    }

    // Dots functionality
    private fun addBottomDots(position: Int) {
        dots = arrayOfNulls(layouts!!.size)
        val colorActive = resources.getIntArray(R.array.dot_active)
        val colorInactive = resources.getIntArray(R.array.dot_inactive)
        dotsLayout!!.removeAllViews()
        for (i in dots.indices) {
            dots!![i] = TextView(this)
            dots[i]!!.text = Html.fromHtml("&#8226;")
            dots[i]!!.textSize = 35f
            dots[i]!!.setTextColor(colorInactive[position])
            dotsLayout!!.addView(dots[i])
        }
        if (dots.size > 0) dots[position]!!.setTextColor(colorActive[position])
    }

    private fun getItem(i: Int): Int {
        return viewPager!!.currentItem + i
    }

    // Viewpager change Listener
    private var viewListener: OnPageChangeListener = object : OnPageChangeListener {
        override fun onPageSelected(position: Int) {
            addBottomDots(position)
            // changing the next button text 'NEXT''
            if (position == layouts!!.size - 1) {
                btn_next.text = "Proceed "
                btn_skip.visibility = View.GONE
            } else {
                btn_next.text = "Next "
                btn_skip.visibility = View.VISIBLE
            }
        }
        override fun onPageScrollStateChanged(state: Int) {}
        override fun onPageScrolled( position: Int, positionOffset: Float, positionOffsetPixels: Int) {
        }
    }

    // Making notification bar transparent
    private fun changeStatusBarColor() {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            val window = window
            window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
            window.statusBarColor = Color.TRANSPARENT
        }
    }

    // PagerAdapter class which will inflate our sliders in our ViewPager
    inner class ViewPagerAdapter : PagerAdapter() {
        private var layoutInflater: LayoutInflater? = null
        override fun instantiateItem(myContainer: ViewGroup, mPosition: Int): Any {
            layoutInflater = getSystemService(LAYOUT_INFLATER_SERVICE) as LayoutInflater?
            val v: View = layoutInflater!!.inflate(layouts[mPosition], myContainer, false)
            myContainer.addView(v)
            return v
        }
        override fun getCount(): Int {
            return layouts.size
        }
        override fun isViewFromObject(mView: View, mObject: Any): Boolean {
            return mView === mObject
        }
        override fun destroyItem(mContainer: ViewGroup, mPosition: Int, mObject: Any) {
            val v = mObject as View
            mContainer.removeView(v)
        }
    }

    // Account kit, method to send an authorization request.
    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.btn_login -> signIn()
            }
        }
    }
    // Process the authorization result.
    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()
            }
        }
    }

}

である.XML Huaweiイメージボタンとスライド操作ボタンのUI画面を作成することができます.

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="500dp" />

    <LinearLayout
        android:id="@+id/layoutDots"
        android:layout_width="match_parent"
        android:layout_height="35dp"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="132dp"
        android:gravity="center"
        android:orientation="horizontal">
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="3dp"
        android:alpha=".5"
        android:layout_above="@id/layoutDots"
        android:background="@android:color/white" />

    <Button
        android:id="@+id/btn_next"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:padding="5dp"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="85dp"
        android:background="@null"
        android:textSize="16sp"
        android:text="Next"
        android:textAllCaps="false"
        android:textColor="@color/dot_dark_screen3" />
    <Button
        android:id="@+id/btn_skip"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_marginBottom="85dp"
        android:layout_marginLeft="10dp"
        android:textSize="16sp"
        android:background="@null"
        android:textAllCaps="false"
        android:text="Skip"
        android:textColor="@color/dot_dark_screen3" />

    <ImageView
        android:id="@+id/btn_login"
        android:layout_width="90dp"
        android:layout_height="70dp"
        android:layout_alignBottom="@id/btn_next"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="-83dp"
        android:padding="5dp"
        android:text="Sign In"
        android:textAllCaps="false"
        android:textColor="@color/dot_dark_screen1"
        app:srcCompat="@drawable/hwid_auth_button_round_black" />

</RelativeLayout>

1を作成します.XMLとスライドビューのレイアウトフォルダーの下に配置し、また、ドロウアブルフォルダーのコンテンツイメージを追加します.別の3つのスライドも同じプロセスを繰り返します.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="600dp"
    android:background="@drawable/slide_1">

</androidx.constraintlayout.widget.ConstraintLayout>

デモ

ヒントとトリック

あなたはすでにHuawei開発者として登録されていることを確認します.

Minsdkのバージョンを24またはそれ以降に設定し、そうでない場合はAndAndManifestマージ問題を取得します.

AGConnectサービスを追加したことを確認します.アプリケーションフォルダにJSONファイル.

確実にSHA - 256指紋を追加したことを確認します.

すべての依存関係が適切に追加されるようにしてください.

結論
この記事では、導入のスライドと一緒にマネー管理アプリでHuaweiアカウントキットを統合する方法を学びました.スライダは、アプリケーションの機能の簡単なビューを提供します.だから、私は今後の記事で他のHuaweiキットを統合するこのマネー管理アプリに関する一連の記事を提供します.
この記事を読んでください.あなたがそれが役に立つとわかるならば、好きとコメントを提供してください.
リファレンス
アカウントキット
アカウントキット