Verification code or password input box style
Use:
1. Add VerificationCodeEditText to the layout file and set relevant custom attributes
<com.lib.verification.code.VerificationCodeEditText
android:id="@+id/rect_edit"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="@null"
android:inputType="number"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:blockColor="@color/lightGrey"
app:borderColor="@color/colorPrimary"
app:borderWidth="2dp"
app:corner="10dp"
app:cursorColor="#ff0000"
app:cursorDuration="1000"
app:cursorWidth="2dp"
app:password="true"
app:maxLength="4"
app:separateType="@integer/type_hollow"
app:showCursor="true" />
*** Need to set width and height for the control ***
2. Description of related attributes
Attribute name | Attribute description |
---|---|
password | Set whether password style, true Display dots |
showCursor | Whether to display the cursor |
separateType | Button style, @ integer/type_hollow hollow square,type_solid = solid square,Type_equipments = underscores |
maxLength | Set the number of display boxes. 0 indicates automatic calculation based on the screen. |
corner | Set fillet dp |
borderColor | Set the solid color of the box, type_solid is applicable |
borderWidth | Set border thickness dp |
blockWidth | Set the width of the box |
blockHeight | Set the height of the box |
blockColor | Set the solid color of the box, type_solid is applicable |
blockSpacing | Set border gap, type_solid, type_underline applies |
cursorDuration | Sets the cursor flicker duration in milliseconds |
cursorWidth | Sets the width of the cursor |
cursorColor | Sets the cursor display color |
3. Set listeners in java code, and you can also set custom related attributes.
val lineEdit = findViewById<VerificationCodeEditText>(R.id.rect_edit)
lineEdit.showCursor = true
lineEdit.textChangedListener = object : VerificationCodeEditText.TextChangedListener {
/**
* Enter / delete listener
*
* @param changeText Enter / delete characters
*/
override fun textChanged(changeText: CharSequence?) {
}
/**
* Input completed
* @param text Entered characters
*/
override fun textCompleted(text: CharSequence?) {
Toast.makeText(applicationContext, text, Toast.LENGTH_LONG).show()
}
}