[FIX] MUS-205 Feature, fixed cursor focus

app/src/main/java/com/mobiuz/app/dev/ui/auth/verification/MyVerificationFragment.kt

+package com.mobiuz.app.dev.ui.auth.verification
+
+import android.os.Bundle
+import android.view.KeyEvent
+import android.view.View
+import android.view.animation.AnimationUtils
+import androidx.core.os.bundleOf
+import androidx.core.view.isVisible
+import androidx.fragment.app.viewModels
+import androidx.lifecycle.lifecycleScope
+import androidx.navigation.NavController
+import androidx.navigation.fragment.NavHostFragment
+import com.google.android.material.textfield.TextInputEditText
+import com.mobiuz.app.R
+import com.mobiuz.app.databinding.FragmentMyVerificationBinding
+import com.mobiuz.app.dev.model.SharedPref
+import com.mobiuz.app.dev.model.UserAuth
+import com.mobiuz.app.dev.network.model.UiStateObject
+import com.mobiuz.app.dev.ui.auth.AuthViewModel
+import com.mobiuz.app.dev.ui.base.BaseFragment
+import com.mobiuz.app.dev.ui.global.ButtonClick
+import com.mobiuz.app.dev.ui.global.CONSTANTS
+import com.mobiuz.app.dev.ui.global.TextWatcherWrapper
+import com.mobiuz.app.dev.utils.Utils
+import com.mobiuz.app.dev.utils.extensions.clearText
+import com.mobiuz.app.dev.utils.extensions.getColorCompat
+import com.mobiuz.app.dev.utils.extensions.isEmpty
+import com.mobiuz.app.dev.utils.extensions.isNotEmpty
+import com.mobiuz.app.dev.utils.hideKeyboard
+import com.mobiuz.app.dev.utils.showKeyboard
+import dagger.hilt.android.AndroidEntryPoint
+import kotlinx.coroutines.flow.collect
+import javax.inject.Inject
+
+
+@AndroidEntryPoint
+class MyVerificationFragment : BaseFragment(R.layout.fragment_my_verification) {
+
+
+    @Inject
+    lateinit var pref: SharedPref
+
+    private var _bn: FragmentMyVerificationBinding? = null
+    private val bn get() = _bn ?: throw NullPointerException("cannot inflate")
+    private val viewModel: AuthViewModel by viewModels()
+    private val navController: NavController by lazy(LazyThreadSafetyMode.NONE) { NavHostFragment.findNavController(this) }
+    private var code = ""
+
+
+    private var phone = ""
+    private var type = ""
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        arguments?.let {
+            phone = it.getString(CONSTANTS.PHONE) ?: ""
+            type = it.getString(CONSTANTS.TYPE_VERIFICATION) ?: ""
+        }
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        _bn = FragmentMyVerificationBinding.bind(view)
+        setUpUI()
+        count(true)
+        collects()
+    }
+
+    override fun setUpUI() {
+        bn.apply {
+
+            toolbar.setNavigationOnClickListener {
+                navController.navigateUp()
+            }
+
+            loadEdited()
+
+            viewGroup.setOnClickListener(object : ButtonClick() {
+                override fun onSingleClick(v: View?) {
+                    v?.hideKeyboard()
+                }
+            })
+
+            frame.setOnClickListener(object : ButtonClick() {
+                override fun onSingleClick(v: View?) {
+                    checkFocus().showKeyboard()
+                    setColorPins(getColorCompat(R.color.black100))
+                }
+            })
+            btnLogin.setOnClickListener(object : ButtonClick() {
+                override fun onSingleClick(v: View?) {
+                    getLinePinCodes()
+                    val auth = UserAuth(phone.replace("+", "").replace(" ", ""), null, code)
+                    if (type == CONSTANTS.TYPE_FORGET) {
+                        viewModel.checkResetCode(auth)
+                    } else {
+                        viewModel.verification(auth)
+                    }
+
+                }
+            })
+
+            sentCodeAgain.setOnClickListener {
+                count(true)
+            }
+            coutdownView.setOnCountdownEndListener {
+                count(false)
+            }
+        }
+    }
+
+    private fun getLinePinCodes() {
+        bn.apply {
+            code = ""
+            code += pin1.text.toString()
+            code += pin2.text.toString()
+            code += pin3.text.toString()
+            code += pin4.text.toString()
+            code += pin5.text.toString()
+            code += pin6.text.toString()
+        }
+    }
+
+    private fun setColorPins(color: Int) {
+        bn.apply {
+            pin1.setTextColor(color)
+            pin2.setTextColor(color)
+            pin3.setTextColor(color)
+            pin4.setTextColor(color)
+            pin5.setTextColor(color)
+            pin6.setTextColor(color)
+        }
+    }
+
+    private fun checkFocus(): View {
+        bn.apply {
+            return when {
+                pin1.isEmpty() -> pin1
+                pin2.isEmpty() -> pin2
+                pin3.isEmpty() -> pin3
+                pin4.isEmpty() -> pin4
+                pin5.isEmpty() -> pin5
+                else -> pin6
+            }
+        }
+    }
+
+    private fun clearLatest(): View {
+        bn.apply {
+            return when {
+                pin6.isNotEmpty() -> pin6.clearText()
+                pin5.isNotEmpty() -> pin5.clearText()
+                pin4.isNotEmpty() -> pin4.clearText()
+                pin3.isNotEmpty() -> pin3.clearText()
+                pin2.isNotEmpty() -> pin2.clearText()
+                else -> pin1.clearText()
+            }
+        }
+    }
+
+    private fun loadEdited() {
+        bn.apply {
+            for (i in 0 until pinView.childCount) {
+                (pinView.getChildAt(i) as TextInputEditText).apply {
+                    this.addTextChangedListener(object : TextWatcherWrapper() {
+                        override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
+                            super.onTextChanged(s, start, before, count)
+                            if (s.toString().isNotEmpty()) {
+                                if (i == pinView.childCount - 1) {
+                                    pin6.hideKeyboard()
+                                    btnLogin.isEnabled = true
+                                } else pinView.getChildAt(i + 1).requestFocus()
+                                this@apply.setBackgroundResource(R.drawable.bgn_ver_checked)
+                            } else {
+                                if (i == pinView.childCount - 1) {
+                                    btnLogin.isEnabled = false
+                                }
+                                this@apply.setBackgroundResource(R.drawable.bgn_ver_unchecked)
+                            }
+                        }
+                    })
+                }
+            }
+            for (i in 0 until pinView.childCount) {
+                pinView.getChildAt(i).setOnKeyListener { _, keyCode, event ->
+                    if (event.action == KeyEvent.ACTION_DOWN && keyCode == KeyEvent.KEYCODE_DEL) {
+                        clearLatest().requestFocus()
+                        return@setOnKeyListener false
+                    }
+                    false
+                }
+            }
+        }
+    }
+
+    override fun collects() {
+        viewLifecycleOwner.lifecycleScope.launchWhenStarted {
+            viewModel.verificationUiState.collect {
+                when (it) {
+                    is UiStateObject.SUCCESS -> {
+                        showProgressDialog(false)
+                        pref.userPhone = phone
+                        navController.navigate(R.id.pinFragment, null, Utils.navOptions())
+                    }
+                    is UiStateObject.ERROR -> {
+                        showProgressDialog(false)
+                        setColorPins(getColorCompat(R.color.primary100))
+                        bn.pinView.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
+                        showSnackMessage(it.message)
+                    }
+
+                    is UiStateObject.LOADING -> {
+                        showProgressDialog(true)
+                    }
+                    else -> Unit
+                }
+            }
+        }
+        viewLifecycleOwner.lifecycleScope.launchWhenStarted {
+            viewModel.checkResetCodeUiState.collect {
+                when (it) {
+                    is UiStateObject.SUCCESS -> {
+                        showProgressDialog(false)
+                        pref.userPhone = phone
+                        navController.navigate(
+                            R.id.registerFragment,
+                            bundleOf(
+                                CONSTANTS.PHONE to phone,
+                                CONSTANTS.TYPE_VERIFICATION to CONSTANTS.TYPE_FORGET,
+                                CONSTANTS.PIN_CODE to code,
+                            ),
+                            Utils.navOptions()
+                        )
+                    }
+                    is UiStateObject.ERROR -> {
+                        showProgressDialog(false)
+                        setColorPins(getColorCompat(R.color.primary100))
+                        bn.pinView.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
+                        showSnackMessage(it.message)
+                    }
+                    is UiStateObject.LOADING -> {
+                        showProgressDialog(true)
+                    }
+                    else -> Unit
+                }
+            }
+        }
+    }
+
+    private fun count(status: Boolean) {
+        bn.apply {
+            sentCodeAgain.isVisible = !status
+            coutdownViewHelperText.isVisible = !status
+            coutdownView.isVisible = status
+            if (status) coutdownView.start(10000)
+        }
+    }
+
+    override fun onDestroy() {
+        _bn = null
+        super.onDestroy()
+    }
+
+}

app/src/main/java/com/mobiuz/app/dev/ui/auth/verification/VerificationFragment.kt

 package com.mobiuz.app.dev.ui.auth.verification
 
+import android.graphics.Color
 import android.os.Bundle
 import android.view.View
 import android.view.animation.AnimationUtils
@@ -20,7 +21,6 @@ import com.mobiuz.app.dev.ui.global.ButtonClick
 import com.mobiuz.app.dev.ui.global.CONSTANTS
 import com.mobiuz.app.dev.ui.global.TextWatcherWrapper
 import com.mobiuz.app.dev.utils.Utils
-import com.mobiuz.app.dev.utils.extensions.showCustomDialog
 import com.mobiuz.app.dev.utils.hideKeyboard
 import dagger.hilt.android.AndroidEntryPoint
 import kotlinx.coroutines.flow.collect
@@ -73,6 +73,7 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
             lineField.addTextChangedListener(object : TextWatcherWrapper() {
                 override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
                     super.onTextChanged(s, start, before, count)
+                    bn.lineField.setTextColor(Color.RED)
                     btnLogin.isEnabled = (s.toString().length == 6)
                 }
             })
@@ -100,6 +101,11 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
         }
     }
 
+    override fun onResume() {
+        super.onResume()
+        bn.lineField.hideKeyboard()
+    }
+
     private fun getLinePinCodes() {
         code = bn.lineField.text.toString()
     }
@@ -110,28 +116,17 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
                 when (it) {
                     is UiStateObject.SUCCESS -> {
                         showProgressDialog(false)
-                        bn.helperLineField.isVisible = false
                         pref.userPhone = phone
                         navController.navigate(R.id.pinFragment, null, Utils.navOptions())
                     }
                     is UiStateObject.ERROR -> {
                         showProgressDialog(false)
+                        bn.lineField.setTextColor(Color.RED)
                         bn.lineField.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
-                        bn.helperLineField.isVisible = false
-                        showCustomDialog(it.message, false) {}
-                    }
-                    is UiStateObject.ERRORS -> {
-                        showProgressDialog(false)
-                        it.errors.forEach {
-                            if (it.key == "code") {
-                                bn.helperLineField.isVisible = true
-                                bn.helperLineField.text = it.message
-                            } else bn.helperLineField.isVisible = false
-                        }
-                        bn.lineField.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
+                        showSnackMessage(it.message)
                     }
+
                     is UiStateObject.LOADING -> {
-                        bn.helperLineField.isVisible = false
                         showProgressDialog(true)
                     }
                     else -> Unit
@@ -143,7 +138,6 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
                 when (it) {
                     is UiStateObject.SUCCESS -> {
                         showProgressDialog(false)
-                        bn.helperLineField.isVisible = false
                         pref.userPhone = phone
                         navController.navigate(
                             R.id.registerFragment,
@@ -157,22 +151,12 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
                     }
                     is UiStateObject.ERROR -> {
                         showProgressDialog(false)
+                        bn.lineField.setTextColor(Color.RED)
                         bn.lineField.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
-                        bn.helperLineField.isVisible = false
-                        showCustomDialog(it.message, false) {}
-                    }
-                    is UiStateObject.ERRORS -> {
-                        showProgressDialog(false)
-                        it.errors.forEach {
-                            if (it.key == "code") {
-                                bn.helperLineField.isVisible = true
-                                bn.helperLineField.text = it.message
-                            } else bn.helperLineField.isVisible = false
-                        }
-                        bn.lineField.startAnimation(AnimationUtils.loadAnimation(requireContext(), R.anim.shake))
+                        showSnackMessage(it.message)
                     }
+
                     is UiStateObject.LOADING -> {
-                        bn.helperLineField.isVisible = false
                         showProgressDialog(true)
                     }
                     else -> Unit
@@ -183,8 +167,9 @@ class VerificationFragment : BaseFragment(R.layout.fragment_verification) {
 
     private fun count(status: Boolean) {
         bn.apply {
+            countWaitText.hideKeyboard()
             sentCodeAgain.isVisible = !status
-            countWaitText.isVisible = status
+            coutdownViewHelperText.isVisible = !status
             coutdownView.isVisible = status
             if (status) coutdownView.start(60000)
         }

app/src/main/java/com/mobiuz/app/dev/utils/extensions/StringExtension.kt

@@ -2,11 +2,22 @@ package com.mobiuz.app.dev.utils.extensions
 
 import android.app.Activity
 import android.content.Context
+import android.graphics.drawable.Drawable
+import android.text.*
+import android.text.method.LinkMovementMethod
+import android.text.style.ClickableSpan
 import android.util.Log
+import android.view.View
+import android.widget.TextView
 import android.widget.Toast
+import androidx.annotation.ColorInt
+import androidx.annotation.ColorRes
+import androidx.annotation.DrawableRes
+import androidx.core.content.ContextCompat
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.FragmentActivity
 import androidx.recyclerview.widget.RecyclerView
+import com.google.android.material.textfield.TextInputEditText
 import com.google.gson.JsonSyntaxException
 import com.mobiuz.app.R
 import com.mobiuz.app.dev.ui.global.ExitDialog
@@ -70,12 +81,44 @@ fun Fragment.showCustomExitDialog(block: () -> Unit) {
     dialog.show(childFragmentManager, "childFragmentManager")
 }
 
-fun Fragment.showCustomDialog(string: String, status: Boolean, block: () -> Unit) {
-    val dialog = SenderDialog(string, status)
-    dialog.setOnClickListener {
-        block()
+//fun Fragment.showCustomDialog(string: String, status: Boolean, block: () -> Unit) {
+//        val snackBar = Snackbar.make(this.requireView(),string, Snackbar.LENGTH_LONG)
+//            .setBackgroundTint(Color.GRAY)
+//            .setTextColor(Color.WHITE)
+//            .setText(string)
+//        snackBar.show()
+//
+//}
+
+fun TextView.makeLinks(vararg links: Pair<String, View.OnClickListener>) {
+    val spannableString = SpannableString(this.text)
+    var startIndexOfLink = -1
+    for (link in links) {
+        val clickableSpan = object : ClickableSpan() {
+            override fun updateDrawState(textPaint: TextPaint) {
+                // use this to change the link color
+                textPaint.color = textPaint.linkColor
+                // toggle below value to enable/disable
+                // the underline shown below the clickable text
+                textPaint.isUnderlineText = true
             }
-    dialog.show(childFragmentManager, "childFragmentManager")
+
+            override fun onClick(view: View) {
+                Selection.setSelection((view as TextView).text as Spannable, 0)
+                view.invalidate()
+                link.second.onClick(view)
+            }
+        }
+        startIndexOfLink = this.text.toString().indexOf(link.first, startIndexOfLink + 1)
+//      if(startIndexOfLink == -1) continue // todo if you want to verify your texts contains links text
+        spannableString.setSpan(
+            clickableSpan, startIndexOfLink, startIndexOfLink + link.first.length,
+            Spanned.SPAN_EXCLUSIVE_EXCLUSIVE
+        )
+    }
+    this.movementMethod =
+        LinkMovementMethod.getInstance() // without LinkMovementMethod, link can not click
+    this.setText(spannableString, TextView.BufferType.SPANNABLE)
 }
 
 fun FragmentActivity.showCustomDialog(string: String, status: Boolean, block: () -> Unit) {
@@ -89,3 +132,33 @@ fun FragmentActivity.showCustomDialog(string: String, status: Boolean, block: ()
 typealias SingleBlock<T> = (T) -> Unit
 typealias MultiBlock<T, K> = (T, K) -> Unit
 typealias ThreeBlock<T, K, M> = (T, K, M) -> Unit
+
+fun TextInputEditText.isNotEmpty(): Boolean {
+    return this.text.toString().isNotEmpty()
+}
+
+fun TextInputEditText.isEmpty(): Boolean {
+    return this.text.toString().trim().isEmpty()
+}
+
+@ColorInt
+fun Context.getColorCompat(@ColorRes colorRes: Int): Int = ContextCompat.getColor(this, colorRes)
+
+@ColorInt
+fun Fragment.getColorCompat(@ColorRes colorRes: Int): Int = ContextCompat.getColor(requireContext(), colorRes)
+
+@ColorInt
+fun FragmentActivity.getColorCompat(@ColorRes colorRes: Int): Int = ContextCompat.getColor(this, colorRes)
+
+@ColorInt
+fun Activity.getColorCompat(@ColorRes colorRes: Int): Int = ContextCompat.getColor(this, colorRes)
+
+fun Context.getDrawableCompat(@DrawableRes drawableRes: Int): Drawable? = ContextCompat.getDrawable(this, drawableRes)
+fun Fragment.getDrawableCompat(@DrawableRes drawableRes: Int): Drawable? = ContextCompat.getDrawable(requireContext(), drawableRes)
+fun FragmentActivity.getDrawableCompat(@DrawableRes drawableRes: Int): Drawable? = ContextCompat.getDrawable(this, drawableRes)
+fun Activity.getDrawableCompat(@DrawableRes drawableRes: Int): Drawable? = ContextCompat.getDrawable(this, drawableRes)
+
+fun TextInputEditText.clearText(): View {
+    this.text?.clear()
+    return this
+}
\ No newline at end of file

app/src/main/res/layout/fragment_base.xml

-<?xml version="1.0" encoding="utf-8"?>
-<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools"
-    android:layout_width="match_parent"
-    android:layout_height="match_parent"
-    tools:context=".dev.ui.base.BaseFragment">
-
-    <!-- TODO: Update blank fragment layout -->
-    <TextView
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:text="@string/hello_blank_fragment" />
-
-</FrameLayout>
\ No newline at end of file

app/src/main/res/layout/fragment_my_verification.xml

+<?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"
+    android:id="@+id/view_group"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:orientation="vertical">
+
+    <com.google.android.material.appbar.MaterialToolbar
+        android:id="@+id/toolbar"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="parent"
+        app:navigationIcon="@drawable/ic_baseline_arrow_back" />
+
+    <TextView
+        android:id="@+id/txt_enter_phone"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="@dimen/_16sdp"
+        android:layout_marginTop="@dimen/_14sdp"
+        android:text="@string/enter_verification"
+        android:textSize="@dimen/_20sdp"
+        android:textStyle="bold"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/toolbar" />
+
+
+    <FrameLayout
+        android:id="@+id/pin_view_group"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginHorizontal="@dimen/_12sdp"
+        android:layout_marginTop="@dimen/_80sdp"
+        android:orientation="horizontal"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/txt_enter_phone">
+
+        <LinearLayout
+            android:id="@+id/pin_view"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            android:layout_gravity="center"
+            android:gravity="center">
+
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_1"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked" />
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_2"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked" />
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_3"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked" />
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_4"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked" />
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_5"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked" />
+
+            <com.google.android.material.textfield.TextInputEditText
+                android:id="@+id/pin_6"
+                style="@style/PinStyle"
+                android:background="@drawable/bgn_ver_unchecked"
+                android:imeOptions="actionDone" />
+
+        </LinearLayout>
+
+        <FrameLayout
+            android:id="@+id/frame"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            android:visibility="visible" />
+    </FrameLayout>
+
+    <LinearLayout
+        android:layout_width="wrap_content"
+        android:layout_height="28dp"
+        android:layout_marginTop="@dimen/_34sdp"
+        android:orientation="horizontal"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/pin_view_group">
+
+        <TextView
+            android:id="@+id/countWaitText"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_vertical"
+            android:text="@string/sent_code_again"
+            android:textColor="@color/grey110"
+            android:textSize="16sp" />
+
+        <cn.iwgang.countdownview.CountdownView
+            android:id="@+id/coutdown_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_vertical"
+            android:layout_marginStart="@dimen/_4sdp"
+            android:layout_marginTop="2dp"
+            app:isHideTimeBackground="false"
+            app:isShowDay="false"
+            app:isShowHour="false"
+            app:isShowMillisecond="false"
+            app:isShowMinute="true"
+            app:isShowSecond="true"
+            app:isShowTimeBgBorder="false"
+            app:isShowTimeBgDivisionLine="false"
+            app:suffixDay="days"
+            app:suffixGravity="center"
+            app:suffixHour=":"
+            app:suffixMillisecond="ss"
+            app:suffixMinute=":"
+            app:suffixSecond=""
+            app:suffixTextColor="@color/grey100"
+            app:suffixTextSize="14sp"
+            app:timeBgColor="@color/white100"
+            app:timeBgRadius="3dp"
+            app:timeBgSize="14dp"
+            app:timeTextSize="14sp" />
+
+        <TextView
+            android:id="@+id/coutdown_view_helper_text"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_vertical"
+            android:layout_marginStart="@dimen/_4sdp"
+            android:text="00:00"
+            android:textColor="@color/primary100"
+            android:textSize="16sp"
+            android:visibility="gone" />
+    </LinearLayout>
+
+
+    <TextView
+        android:id="@+id/sent_code_again"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_centerHorizontal="true"
+        android:layout_marginTop="@dimen/_10sdp"
+        android:background="?selectableItemBackground"
+        android:padding="@dimen/_10sdp"
+        android:text="@string/sent_code_again"
+        android:textColor="@color/primary100"
+        android:textSize="16sp"
+        android:textStyle="bold"
+        android:visibility="visible"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/btn_login" />
+
+
+
+    <Button
+        android:id="@+id/btn_login"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_gravity="bottom"
+        android:layout_marginHorizontal="@dimen/_16sdp"
+        android:layout_marginTop="@dimen/_24sdp"
+        android:enabled="false"
+        android:text="@string/continuoue"
+        android:textSize="@dimen/_12sdp"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/pin_view_group" />
+
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file

app/src/main/res/layout/fragment_verification.xml

@@ -20,7 +20,7 @@
         android:layout_marginStart="@dimen/_16sdp"
         android:layout_marginTop="@dimen/_14sdp"
         android:text="@string/enter_verification"
-        android:textSize="@dimen/_20sdp"
+        android:textSize="29sp"
         android:textStyle="bold"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toBottomOf="@id/toolbar" />
@@ -30,101 +30,101 @@
         android:id="@+id/line_field"
         android:layout_width="@dimen/_220sdp"
         android:layout_height="wrap_content"
-        android:paddingHorizontal="@dimen/_14sdp"
-        android:layout_marginTop="@dimen/_80sdp"
+        android:layout_marginTop="64dp"
         android:hint="******"
-        android:orientation="horizontal"
+        android:imeOptions="actionDone"
+        android:inputType="number"
+        android:paddingHorizontal="@dimen/_14sdp"
         android:textColorHint="@color/black"
-        android:textSize="@dimen/_16sdp"
+        android:textSize="20sp"
         android:textStyle="bold"
-        android:textSelectHandle="@drawable/text_handle"
-        android:inputType="number"
-        app:highlightType="allFields"
         app:cornerRadius="@dimen/_6sdp"
+        app:fieldColor="@color/grey80"
+        app:highlightType="allFields"
         app:isCursorEnabled="true"
-        app:fieldColor="@color/black"
-        app:highlightColor="@color/red"
-        app:isCustomBackground="false"
-        app:lineThickness="1dp"
-        android:imeOptions="actionDone"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintTop_toBottomOf="@id/txt_enter_phone"
+        app:lineThickness="1dp"
         app:noOfFields="6" />
 
-    <TextView
-        android:id="@+id/helper_line_field"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:text="error"
-        android:visibility="invisible"
-        android:layout_margin="@dimen/_4sdp"
-        android:textStyle="bold"
-        android:textColor="@color/red"
-        app:layout_constraintStart_toStartOf="@id/line_field"
-        app:layout_constraintTop_toBottomOf="@id/line_field" />
-
 
-    <TextView
-        android:id="@+id/countWaitText"
+    <LinearLayout
         android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_centerHorizontal="true"
+        android:layout_height="28dp"
         android:layout_marginTop="@dimen/_34sdp"
-        android:text="@string/sent_code_again"
-        android:textSize="16sp"
-        android:textColor="#97ADB6"
-        app:layout_constraintEnd_toStartOf="@id/coutdown_view"
-        app:layout_constraintHorizontal_chainStyle="packed"
+        android:orientation="horizontal"
+        app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/line_field" />
+        app:layout_constraintTop_toBottomOf="@+id/line_field">
 
         <TextView
-        android:id="@+id/sent_code_again"
+            android:id="@+id/countWaitText"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-        android:layout_centerHorizontal="true"
-        android:layout_marginTop="38dp"
-        android:background="?selectableItemBackground"
+            android:layout_gravity="center_vertical"
             android:text="@string/sent_code_again"
-        android:textSize="14sp"
-        android:textColor="#FF9500"
-        android:visibility="gone"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintHorizontal_chainStyle="packed"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/line_field" />
+            android:textColor="@color/grey110"
+            android:textSize="16sp" />
 
         <cn.iwgang.countdownview.CountdownView
             android:id="@+id/coutdown_view"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-        android:layout_marginStart="@dimen/_10sdp"
+            android:layout_gravity="center_vertical"
+            android:layout_marginStart="@dimen/_4sdp"
+            android:layout_marginTop="2dp"
             app:isHideTimeBackground="false"
             app:isShowDay="false"
             app:isShowHour="false"
             app:isShowMillisecond="false"
             app:isShowMinute="true"
             app:isShowSecond="true"
-        app:suffixTextColor="#97ADB6"
-        android:layout_marginTop="4dp"
             app:isShowTimeBgBorder="false"
             app:isShowTimeBgDivisionLine="false"
-        app:layout_constraintBottom_toBottomOf="@id/countWaitText"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toEndOf="@id/countWaitText"
-        app:layout_constraintTop_toTopOf="@id/countWaitText"
             app:suffixDay="days"
             app:suffixGravity="center"
             app:suffixHour=":"
             app:suffixMillisecond="ss"
             app:suffixMinute=":"
             app:suffixSecond=""
-        app:suffixTextSize="16sp"
+            app:suffixTextColor="#97ADB6"
+            app:suffixTextSize="14sp"
             app:timeBgColor="#00FF5000"
             app:timeBgRadius="3dp"
-        app:timeBgSize="16dp"
-        app:timeTextSize="16dp" />
+            app:timeBgSize="14dp"
+            app:timeTextSize="14sp" />
+
+        <TextView
+            android:id="@+id/coutdown_view_helper_text"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_vertical"
+            android:layout_marginStart="@dimen/_4sdp"
+            android:text="00:00"
+            android:textColor="@color/primary100"
+            android:textSize="16sp"
+            android:visibility="gone" />
+    </LinearLayout>
+
+
+    <TextView
+        android:id="@+id/sent_code_again"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_centerHorizontal="true"
+        android:layout_marginTop="@dimen/_10sdp"
+        android:background="?selectableItemBackground"
+        android:padding="@dimen/_10sdp"
+        android:text="@string/sent_code_again"
+        android:textColor="@color/primary100"
+        android:textSize="16sp"
+        android:textStyle="bold"
+        android:visibility="visible"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintHorizontal_chainStyle="packed"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/btn_login" />
 
 
     <Button