Open In App

How to Generate Pattern Password in Android?

Improve
Improve
Like Article
Like
Save
Share
Report

Pattern Password for the device is one of the necessities to keep our device private and protected. Nowadays in most apps, we get to see this password applied in many applications such as Mutual Funds or Stock Market apps to keep our financial details private. In this article, we are going to see how to implement pattern passwords in our Android app. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language. 

Generate Pattern Password in Android Sample GIF

Applications of Pattern Password

  • Use to protect our private details and personal information in an Android app.
  • It becomes very convenient to use pattern passwords instead of pins.
  • It works as an app Lock to our app on our device.

Attributes of Pattern Password

Attributes Description
layout_width To display the width of the dots.
layout_height To display the height of the dots.
correctStateColor To display Dots color.

Step by Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add dependency of Pattern Password library in build.gradle file

Then Navigate to gradle scripts and then to build.gradle(Module) level. Add below line in build.gradle file in the dependencies section.

implementation ‘com.andrognito.patternlockview:patternlockview:1.0.0’

now click on Sync now it will sync your all files in build.gradle().

Step 3: Create a Loading Screen in your activity_main.xml file

Navigate to the app > res > layout to open the activity_main.xml file. Below is the code for the activity_main.xml file. 

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <!--Text view for giving loading-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Loading...." />
      
</RelativeLayout>


Step 4: Working with the MainActivity.java file

Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.

Java




import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;
  
import androidx.appcompat.app.AppCompatActivity;
  
public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        Handler handler = new Handler();
        handler.postDelayed(new Runnable() {
            @Override
            public void run() {
                // loading is given
                SharedPreferences sharedPreferences = getSharedPreferences("PREFS", 0);
                String password = sharedPreferences.getString("password", "0");
                if (password.equals("0")) {
                    // Intent to navigate to Create Password Screen
                    Intent intent = new Intent(getApplicationContext(), CreatePasswordActivity.class);
                    startActivity(intent);
                    finish();
                } else {
                    // Intent to navigate to Input Password Screen
                    Intent intent = new Intent(getApplicationContext(), InputPasswordActivity.class);
                    startActivity(intent);
                    finish();
                }
            }
        }, 2000);
    }
}


Step 5: Create a new empty Activity and name it as CreatePasswordActivity

Go to the app > java > Your app’s package name > right-click > New > Activity > Empty Activity and name the activity as CreatePasswordActivity.

Working with the activity_create_password.xml file:

Go to the activity_create_password.xml file and refer to the following code. Below is the code for the activity_create_password.xml file. In this file, you will show dots to create a pattern password as given below.

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <!--Dots to create pattern pass word-->
    <com.andrognito.patternlockview.PatternLockView
        android:id="@+id/pattern_lock_view"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerInParent="true"
        app:correctStateColor="@color/purple_200"
        app:normalStateColor="@color/purple_200"
        app:wrongStateColor="@color/teal_700" />
  
    <!--Text View to display title-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:text="Create Password"
        android:textSize="30dp"
        android:textStyle="bold" />
  
</RelativeLayout>


Working with the CreatePasswordActivity.java file:

Go to the CreatePasswordActivity.java file and refer to the following code. Below is the code for the CreatePasswordActivity.java file. Comments are added inside the code to understand the code in more detail.

Java




import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.andrognito.patternlockview.PatternLockView;
import com.andrognito.patternlockview.listener.PatternLockViewListener;
import com.andrognito.patternlockview.utils.PatternLockUtils;
  
import java.util.List;
  
public class CreatePasswordActivity extends AppCompatActivity {
  
    // Initialize pattern lock view
    PatternLockView mPatternLockView;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_create_password);
  
        mPatternLockView = (PatternLockView) findViewById(R.id.pattern_lock_view);
        mPatternLockView.addPatternLockListener(new PatternLockViewListener() {
            @Override
            public void onStarted() {
  
            }
  
            @Override
            public void onProgress(List<PatternLockView.Dot> progressPattern) {
  
            }
  
            @Override
            public void onComplete(List<PatternLockView.Dot> pattern) {
                // Shared Preferences to save state
                SharedPreferences sharedPreferences = getSharedPreferences("PREFS", 0);
                SharedPreferences.Editor editor = sharedPreferences.edit();
                editor.putString("password", PatternLockUtils.patternToString(mPatternLockView, pattern));
                editor.apply();
                  
                // Intent to navigate to home screen when password added is true
                Intent intent = new Intent(getApplicationContext(), ProgramActivity.class);
                startActivity(intent);
                finish();
            }
            @Override
            public void onCleared() {
  
            }
        });
    }
}


Step 6: Similarly Create a new empty Activity and name it as InputPasswordActivity

Go to the app > java > Your app’s package name > right-click > New > Activity > Empty Activity and name the activity as InputPasswordActivity.

Working with the activity_Input_Password.xml file:

Go to the activity_Input_Password.xml file and refer to the following code. Below is the code for the activity_Input_Password.xml file. In this file, you will draw your pattern to navigate to the home screen when the user opened the app for the second time after installing.

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <!--Dots to input password-->
    <com.andrognito.patternlockview.PatternLockView
        android:id="@+id/pattern_lock_view"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerInParent="true"
        app:correctStateColor="@color/purple_200"
        app:normalStateColor="@color/purple_200"
        app:wrongStateColor="@color/teal_700" />
  
    <!--Text View to display title-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"
        android:text="Input Password"
        android:textSize="30dp"
        android:textStyle="bold" />
  
</RelativeLayout>


Working with the InputPasswordActivity.java file:

Go to the InputPasswordActivity.java file and refer to the following code. Below is the code for the InputPasswordActivity.java file. Comments are added inside the code to understand the code in more detail.

Java




import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.widget.Toast;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.andrognito.patternlockview.PatternLockView;
import com.andrognito.patternlockview.listener.PatternLockViewListener;
import com.andrognito.patternlockview.utils.PatternLockUtils;
  
import java.util.List;
  
public class InputPasswordActivity extends AppCompatActivity {
  
    PatternLockView mPatternLockView;
    String password;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_input_password);
          
        // shared preference when user comes second time to the app
        SharedPreferences sharedPreferences = getSharedPreferences("PREFS", 0);
        password = sharedPreferences.getString("password", "0");
          
        mPatternLockView = (PatternLockView) findViewById(R.id.pattern_lock_view);
        mPatternLockView.addPatternLockListener(new PatternLockViewListener() {
            @Override
            public void onStarted() {
  
            }
  
            @Override
            public void onProgress(List<PatternLockView.Dot> progressPattern) {
  
            }
  
            @Override
            public void onComplete(List<PatternLockView.Dot> pattern) {
                // if drawn pattern is equal to created pattern you will navigate to home screen
                if (password.equals(PatternLockUtils.patternToString(mPatternLockView, pattern))) {
                    Intent intent = new Intent(getApplicationContext(), ProgramActivity.class);
                    startActivity(intent);
                    finish();
                } else {
                    // other wise you will get error wrong password
                    Toast.makeText(InputPasswordActivity.this, "Wrong Password", Toast.LENGTH_SHORT).show();
                    mPatternLockView.clearPattern();
                }
            }
  
            @Override
            public void onCleared() {
  
            }
        });
    }
}


Step 7: Similarly, Create a new empty Activity and name it as ProgramActivity

Go to the app > java > Your app’s package name > right-click > New > Activity > Empty Activity and name the activity as ProgramActivity.

Working with the activity_program.xml file:

Go to the activity_program.xml file and refer to the following code. Below is the code for the activity_program.xml file. In this file, we will create Home Screen to navigate the user to the main screen. Where you will get to see the text message.

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <!--Text Message to display-->
    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Welcome to Geeks to Geeks"
        android:textSize="20dp"
        tools:layout_editor_absoluteX="163dp"
        tools:layout_editor_absoluteY="334dp" />
      
</RelativeLayout>


 Now click on the run option it will take some time to build Gradle. After that, you will get output on your device as given below.

Output:



Last Updated : 21 Jan, 2021
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads