Heavily customizable OTP or Pin View. Note:OTPView is still in early stages
OTPView is meant to be a highly customizable OTP / Pin View for android. It supports customization for text styling, background styling, and dimensional styling. It defines the view as 3 segments:
- The Highlighted Item
- The Empty Item
- The filled Item
Each type can be customized separately, with the empty item being the default.
The OTPView also supports some android standards such as android:inputType, android:importantForAutofill and android:autofillHints so you can easily set options like numbers/string, allcaps, etc.
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
dependencies {
implementation 'com.github.KevinSchildhorn:OTPView:0.2.5'
}
| Attribute | Format | Description | Default |
|---|---|---|---|
| otp_itemCount | integer | The length of the input | 1 |
| otp_showCursor | boolean | Should show cursor | false |
| otp_itemWidth | dimension | width of each item | 44dp |
| otp_itemHeight | dimension | height of each item | 44dp |
| otp_cursorColor | color | color of the cursor | Black |
| otp_underscoreCursor (Experimental) | boolean | if true will show '_' instead of ' | ' for the cursor |
| otp_customCursor | drawable | custom drawable for the cursor, overrides otp_underscoreCursor | null |
| otp_allcaps | boolean | all caps(if fails set input type) | false |
| otp_marginBetween | dimension | margin between each item horizontally | 8dp |
| otp_isPassword | boolean | sets previously entered items as hidden | false |
| otp_textSize | dimension | The text size of items past the cursor | 14dp |
| otp_textColor | integer | The text color of items past the cursor | Black |
| otp_backgroundImage | reference | The background image of items past the cursor | N/A |
| otp_Font | reference | The font of items past the cursor | Roboto |
| otp_highlightedTextSize | dimension | The text size of the highlighted item | otp_textSize |
| otp_highlightedTextColor | integer | The text color of the highlighted item | otp_textColor |
| otp_highlightedBackgroundImage | reference | The background image of the highlighted item | otp_backgroundImage |
| otp_highlightedFont | reference | The font of the highlighted item | otp_Font |
| otp_filledTextSize | dimension | The text size of items before the cursor | otp_textSize |
| otp_filledTextColor | integer | The text color of items before the cursor | otp_textColor |
| otp_filledBackgroundImage | reference | The background image of items before the cursor | otp_backgroundImage |
| otp_filledFont | reference | The font of items before the cursor | otp_Font |
fun setOnFinishListener(func: (String) -> Unit)- Simple listener callback for when all items have been filled
otp_view.setOnFinishListener {
Toast.makeText(this,it,Toast.LENGTH_LONG).show()
}
-
fun setOnCharacterUpdatedListener(func: (Boolean) -> Unit)- listener callback for when a character was updated. Returns whether or not it was filled. -
fun setText(str:String)- Fills in as much of the text into the items as possible, with one character for each item. Overflow characters are discarded. -
fun clearText(showKeyboard: Boolean)- Clears all the text, also has the option to hide or show the keyboard on the first item. -
fun copyText(showKeyboard: Boolean)- Copies text from OTP View. -
fun pasteText(showKeyboard: Boolean)- Pastes text from OTP View, paste menu item should be overridden from Activity. -
fun fitToWidth(width: Int)- Fits the entire view to the width entered. Made so that you can dynamically resize the view. -
fun isFilled(): Boolean- Returns whether or not all the fields have been filled. -
fun getStringFromFields(): String- Returns the string from the view. -
override fun setEnabled(enabled: Boolean)- Allows you to disable the view as you normally would.
