pinview icon indicating copy to clipboard operation
pinview copied to clipboard

Android customizable input view

download build license

PinView

Android customizable pin input view.

demo1 demo2

Download

repositories {
    google()
    jcenter()
}

dependencies {
    compile "com.hendraanggrian.appcompat:pinview:$version"
}

Usage

Declare view in xml layout.

<com.hendraanggrian.appcompat.widget.PinGroup
    android:id="@+id/pinGroup"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:pinTextAppearance="@style/TextAppearance.AppCompat.Display2"
    app:pinCount="6" />

Then in java.

PinGroup view = findViewById<>(R.id.pinView);
CharSequence pin = view.getText();

// set listener
view.setOnStateChangedListener(new PinGroup.OnStateChangedListener() {
    @Override
    public void onStateChanged(@NonNull PinGroup view, boolean isComplete) {
        // do something
    }
});
view.setOnPinChangedListener(new PinGroup.OnPinChangedListener() {
    @Override
    public void onStateChanged(@NonNull PinGroup view, @NonNull CharSequence pin) {
        // do something
    }
});

Use custom pin

Make a class that extends PinView.

package com.example;

public class CustomPinView extends com.hendraanggrian.appcompat.widget.PinView {
    
    public CustomPinView(Context context) {
        super(context);
        doSomething();
    }
}

Then refer to that class in xml, there is no way to do change it programmatically.

<com.hendraanggrian.appcompat.widget.PinGroup
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:pinView="com.example.CustomPinView" />