Skip to content
Keval Patel edited this page Apr 15, 2018 · 4 revisions

PatternView provides application ability to authenticate it using pattern or fingerprint.

  • Add PatternView in your layout file.

    <com.kevalpatel.passcodeview.PatternView
            android:id="@+id/pattern_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/imageView"
            app:dividerColor="@color/colorPrimaryDark"
            app:fingerprintDefaultText="Scan your finger to unlock application"
            app:fingerprintEnable="true"
            app:fingerprintTextColor="@color/colorAccent"
            app:fingerprintTextSize="@dimen/finger_print_text_size"
            app:giveTactileFeedback="true"
            app:patternLineColor="@color/colorAccent"
            app:titleTextColor="@android:color/white"/>
  • Get the instance of the view in your activity/fragment.

    @Override
    protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      PatternView patternView = (PatternView) findViewById(R.id.pattern_view);
      //...
    }
  • Set the number of rows and columns of the pattern in your activity/fragment.

      //Set number of pattern counts.
      //REQUIRED
      patternView.setNoOfColumn(3);   //Number of columns
      patternView.setNoOfRows(3);     //Number of rows
  • Set the authenticator

    • Set the authenticator which will tell if your pattern is correct or not.
    • The library provides inbuilt PasscodeViewPatternAuthenticator . This authenticator will match the pattern entered by the user with the correct pattern provided.
    • You can write your custom authenticator to customize the authentication logic.
    • Here is the example with the inbuilt pattern authenticator. Make sure your PatternPiont row or column number is not greater than the number of row and number of columns from the previous step.
       //Set the correct pin code.
       //Display row and column number of the pattern point sequence.
       //REQUIRED
       final PatternPoint[] correctPattern = new PatternPoint[]{
               new PatternPoint(0, 0),
               new PatternPoint(1, 0),
               new PatternPoint(2, 0),
               new PatternPoint(2, 1)
       };
       patternView.setAuthenticator(new PasscodeViewPatternAuthenticator(correctPattern));
  • Set the pattern cell shape.

    • There are two built-in pattern cells available.
      • Circle indicator
      • Dot indicator
    • If you want to create custom indicator with the custom shape, see How to create custom indicator?.
    • You can learn more about other indicators from here.
    • Here is the example of the round indicator.
      //Build the desired indicator shape and pass the theme attributes.
      //REQUIRED
      patternView.setPatternCell(new CirclePatternCell.Builder(patternView)
              .setRadius(R.dimen.pattern_cell_radius)
              .setCellColorResource(R.color.colorAccent));
  • Set callback listener to get callbacks when the user is authenticated or authentication fails.

    patternView.setAuthenticationListener(new AuthenticationListener() {
        @Override
        public void onAuthenticationSuccessful() {
            //User authenticated successfully.
        }

        @Override
        public void onAuthenticationFailed() {
            //Calls whenever authentication is failed or user is unauthorized.
            //Do something
        }
    });

Screenshot:

Pattern view