Pattern Lock View

Awesome pattern lock view for android written in kotlin.

Features

  • easy to use
  • beautiful built-in styles
  • fully customizable
  • tiny size around 35 KB

Preview

nine

jdstyle

indicator

default

Usage

Gradle

Top level build file:

allprojects {
    repositories {
        jcenter()
    }
}

In your application build file:

implementation 'com.itsxtt:patternlockview:0.1.0'

XML

<com.itsxtt.patternlock.PatternLockView
    android:id="@+id/patternLockView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Kotlin

patternLockView.setOnPatternListener(object : PatternLockView.OnPatternListener {
    override fun onStarted() {
        super.onStarted()
    }

    override fun onProgress(ids: ArrayList<Int>) {
        super.onProgress(ids)
    }

    override fun onComplete(ids: ArrayList<Int>): Boolean {
        /*
         * A return value required
         * if the pattern is not correct and you'd like change the pattern to error state, return false
         * otherwise return true
         */
        return isPatternCorrect()
    }
})

Java

patternLockView.setOnPatternListener(new PatternLockView.OnPatternListener() {
    @Override
    public void onStarted() {

    }

    @Override
    public void onProgress(ArrayList<Integer> ids) {

    }

    @Override
    public boolean onComplete(ArrayList<Integer> ids) {
        /*
         * A return value required
         * if the pattern is not correct and you'd like change the pattern to error state, return false
         * otherwise return true
         */
        return isPatternCorrect();
    }
});

Customization

Built-in Styles

preview

style="@style/PatternLockView.JDStyle"

preview

style="@style/PatternLockView.WithIndicator"

Custom Attributes

name format default value description
plv_regularCellBackground color|reference null
plv_regularDotColor color #d8dbe9
plv_regularDotRadiusRatio float 0.3
plv_selectedCellBackground color|reference null
plv_selectedDotColor color #587bf4
plv_selectedDotRadiusRatio float 0.3
plv_errorCellBackground color|reference null
plv_errorDotColor color #ea4954
plv_errorDotRadiusRatio float 0.3
plv_lineStyle enum common two values: common, indicator
plv_lineWidth dimension 2dp
plv_regularLineColor color #587bf4
plv_errorLineColor color #ea4954
plv_spacing dimension 24dp
plv_rowCount integer 3
plv_columnCount integer 3
plv_errorDuration integer 400 millisecond
plv_hitAreaPaddingRatio float 0.2
plv_indicatorSizeRatio float 0.2

Secure Mode

You can turn the secure mode on or off via call enableSecureMode() and disableSecureMode().

GitHub