Add code size and code length

phong016688 · phong016688 · commit e961241120b2 · 2023-07-06T12:05:16.000+07:00
diff --git a/app/src/main/java/com/otp/code/MainActivity.kt b/app/src/main/java/com/otp/code/MainActivity.kt
@@ -1,5 +1,6 @@
 package com.otp.code
 
+import android.annotation.SuppressLint
 import android.content.Intent
 import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
@@ -37,6 +38,7 @@ class MainActivity : AppCompatActivity() {
         }
     }
 
+    @SuppressLint("SetTextI18n")
     override fun onStart() {
         super.onStart()
         job = CoroutineScope(Dispatchers.Main).launch {
diff --git a/app/src/main/java/com/otp/code/WhiteActivity.kt b/app/src/main/java/com/otp/code/WhiteActivity.kt
@@ -1,5 +1,6 @@
 package com.otp.code
 
+import android.annotation.SuppressLint
 import android.content.Intent
 import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
@@ -36,11 +37,12 @@ class WhiteActivity : AppCompatActivity() {
         binding.btnChangeBg.setOnClickListener { finish() }
     }
 
+    @SuppressLint("SetTextI18n")
     override fun onStart() {
         super.onStart()
         job = CoroutineScope(Dispatchers.Main).launch {
             while (true) {
-                currentCode = Random.nextInt(999..9999).toString()
+                currentCode = Random.nextInt(9999999..99999999).toString()
                 binding.tvCode.text = "Code: $currentCode"
                 delay(60_000)
             }
diff --git a/app/src/main/res/layout/activity_main.xml b/app/src/main/res/layout/activity_main.xml
@@ -22,6 +22,7 @@
         android:id="@+id/verify_code"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
+        android:layout_marginHorizontal="16dp"
         android:layout_marginTop="100dp"
         app:layout_constraintTop_toBottomOf="@id/tv_code" />
 
diff --git a/app/src/main/res/layout/white_activity.xml b/app/src/main/res/layout/white_activity.xml
@@ -21,16 +21,18 @@
         android:id="@+id/verify_code"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
+        android:layout_marginHorizontal="16dp"
+        android:layout_marginTop="100dp"
+        app:code_background_color="#ECE6E1"
         app:code_color="#CC171717"
-        app:code_stroke_color="#185C1F"
-        app:code_done_stroke_color="#1AA327"
-        app:code_background_color="#667A7979"
+        app:code_done_stroke_color="#0CBA00"
         app:code_error_color="#A50202"
-        app:code_stroke_error_color="#F11919"
-        app:code_length="4"
+        app:code_length="14"
         app:code_radius="10dp"
+        app:code_stroke_color="#990018B6"
+        app:code_stroke_error_color="#F11919"
         app:code_stroke_width="2dp"
-        android:layout_marginTop="100dp"
+        app:code_text_size="18sp"
         app:layout_constraintTop_toBottomOf="@id/tv_code" />
 
     <Button
diff --git a/otp_code_view/src/main/java/com/otp/otp_code_view/OtpCodeView.kt b/otp_code_view/src/main/java/com/otp/otp_code_view/OtpCodeView.kt
@@ -7,6 +7,7 @@ import android.graphics.drawable.GradientDrawable
 import android.text.InputFilter
 import android.util.AttributeSet
 import android.util.DisplayMetrics
+import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.inputmethod.InputMethodManager
@@ -16,6 +17,7 @@ import android.widget.TextView
 import androidx.core.content.ContextCompat
 import androidx.core.widget.doOnTextChanged
 import com.otp.otp_code_view.databinding.VerifyOtpCodeViewBinding
+import kotlin.math.min
 
 class OtpCodeView @JvmOverloads constructor(
     context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
@@ -31,27 +33,22 @@ class OtpCodeView @JvmOverloads constructor(
     private var codeErrorColor: Int
     private var codeDoneStrokeColor: Int
     private var codeRadius: Float
+    private var codeTextSize: Float
 
     init {
         binding = VerifyOtpCodeViewBinding.inflate(LayoutInflater.from(context))
         addView(binding.root)
         val attributes = context.obtainStyledAttributes(
-            attrs,
-            R.styleable.OtpCodeView,
-            defStyleAttr,
-            defStyleAttr
+            attrs, R.styleable.OtpCodeView, defStyleAttr, defStyleAttr
         )
         codeLength = attributes.getInteger(
-            R.styleable.OtpCodeView_code_length,
-            6
-        )
+            R.styleable.OtpCodeView_code_length, 6
+        ).let { maxOf(min(it, 8), 1) }
         codeStrokeWidth = attributes.getDimension(
-            R.styleable.OtpCodeView_code_stroke_width,
-            1 * ratioDpToPixels
+            R.styleable.OtpCodeView_code_stroke_width, 1 * ratioDpToPixels
         )
         codeRadius = attributes.getDimension(
-            R.styleable.OtpCodeView_code_radius,
-            12 * ratioDpToPixels
+            R.styleable.OtpCodeView_code_radius, 12 * ratioDpToPixels
         )
         codeColor = attributes.getColor(
             R.styleable.OtpCodeView_code_color,
@@ -77,6 +74,9 @@ class OtpCodeView @JvmOverloads constructor(
             R.styleable.OtpCodeView_code_done_stroke_color,
             ContextCompat.getColor(context, R.color.color_fec70a)
         )
+        codeTextSize = attributes.getDimension(
+            R.styleable.OtpCodeView_code_text_size, 24f * 6 * ratioSpToPixels / codeLength
+        )
         attributes.recycle()
         handleInputCode()
     }
@@ -90,6 +90,7 @@ class OtpCodeView @JvmOverloads constructor(
         mainEditText.doOnTextChanged { text, _, _, _ -> handleShowCode(text, listTextView) }
         listTextView.forEachIndexed { index, textview ->
             if (index >= codeLength) textview.visibility = View.GONE
+            textview.setTextSize(TypedValue.COMPLEX_UNIT_PX, codeTextSize)
             textview.setTextColor(codeColor)
             textview.background = getDrawable(codeStrokeColor, false)
         }
@@ -171,12 +172,14 @@ class OtpCodeView @JvmOverloads constructor(
         }
     }
 
+
     companion object {
         @JvmField
         val ratioDpToPixels =
             Resources.getSystem().displayMetrics.densityDpi.toFloat() / DisplayMetrics.DENSITY_DEFAULT
 
         @JvmField
-        val ratioPixelsToDp: Float = (1.0 / ratioDpToPixels.toDouble()).toFloat()
+        @Suppress("DEPRECATION")
+        val ratioSpToPixels = Resources.getSystem().displayMetrics.scaledDensity
     }
 }
diff --git a/otp_code_view/src/main/res/layout/verify_otp_code_view.xml b/otp_code_view/src/main/res/layout/verify_otp_code_view.xml
@@ -1,28 +1,31 @@
 <?xml version="1.0" encoding="utf-8"?>
 <androidx.appcompat.widget.LinearLayoutCompat 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="wrap_content"
     android:orientation="vertical">
 
     <androidx.constraintlayout.widget.ConstraintLayout
         android:id="@+id/ctn_input_code"
         android:layout_width="match_parent"
-        android:layout_height="60dp"
-        android:layout_marginHorizontal="16dp"
+        android:layout_height="wrap_content"
         android:layout_marginTop="10dp">
 
         <EditText
             android:id="@+id/edt_code"
             android:layout_width="match_parent"
-            android:layout_height="match_parent"
+            android:layout_height="0dp"
             android:autofillHints="smsOTPCode"
             android:background="@android:color/transparent"
             android:cursorVisible="false"
             android:focusable="true"
             android:importantForAutofill="yes"
             android:inputType="number"
-            android:textColor="@android:color/transparent" />
+            android:textColor="@android:color/transparent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            tools:ignore="LabelFor" />
 
         <TextView
             android:id="@+id/tv1"
@@ -110,20 +113,49 @@
             android:textStyle="bold"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintDimensionRatio="1:1"
-            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintEnd_toStartOf="@id/tv7"
             app:layout_constraintStart_toEndOf="@id/tv5"
             app:layout_constraintTop_toTopOf="parent" />
 
+        <TextView
+            android:id="@+id/tv7"
+            android:layout_width="0dp"
+            android:layout_height="0dp"
+            android:layout_marginHorizontal="4dp"
+            android:gravity="center"
+            android:textColor="@color/color_f2f2f2"
+            android:textSize="24sp"
+            android:textStyle="bold"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintDimensionRatio="1:1"
+            app:layout_constraintEnd_toStartOf="@id/tv8"
+            app:layout_constraintStart_toEndOf="@id/tv6"
+            app:layout_constraintTop_toTopOf="parent" />
+
+        <TextView
+            android:id="@+id/tv8"
+            android:layout_width="0dp"
+            android:layout_height="0dp"
+            android:layout_marginHorizontal="4dp"
+            android:gravity="center"
+            android:textColor="@color/color_f2f2f2"
+            android:textSize="24sp"
+            android:textStyle="bold"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintDimensionRatio="1:1"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toEndOf="@id/tv7"
+            app:layout_constraintTop_toTopOf="parent" />
+
     </androidx.constraintlayout.widget.ConstraintLayout>
 
     <TextView
         android:id="@+id/tvCodeInvalid"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_marginHorizontal="20dp"
         android:layout_marginTop="10dp"
         android:gravity="center_vertical"
-        android:padding="5dp"
+        android:padding="4dp"
         android:text="@string/invalid_code"
         android:textColor="@color/color_c45048"
         android:textSize="14sp"
diff --git a/otp_code_view/src/main/res/values/atttrs.xml b/otp_code_view/src/main/res/values/atttrs.xml
@@ -4,6 +4,7 @@
     <declare-styleable name="OtpCodeView">
         <attr name="code_radius" format="dimension" />
         <attr name="code_length" format="integer" />
+        <attr name="code_text_size" format="dimension" />
         <attr name="code_color" format="color" />
         <attr name="code_background_color" format="color" />
         <attr name="code_stroke_color" format="color" />

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,6 @@`
`1`	`1`	`package com.otp.code`
`2`	`2`
	`3`	`+import android.annotation.SuppressLint`
`3`	`4`	`import android.content.Intent`
`4`	`5`	`import androidx.appcompat.app.AppCompatActivity`
`5`	`6`	`import android.os.Bundle`
`@@ -37,6 +38,7 @@ class MainActivity : AppCompatActivity() {`
`37`	`38`	`}`
`38`	`39`	`}`
`39`	`40`
	`41`	`+ @SuppressLint("SetTextI18n")`
`40`	`42`	`override fun onStart() {`
`41`	`43`	`super.onStart()`
`42`	`44`	`job = CoroutineScope(Dispatchers.Main).launch {`