{"id":13645304,"url":"https://github.com/aritraroy/PatternLockView","last_synced_at":"2025-04-21T13:32:36.558Z","repository":{"id":38206432,"uuid":"86371864","full_name":"aritraroy/PatternLockView","owner":"aritraroy","description":"An easy-to-use, customizable and Material Design ready Pattern Lock view for Android","archived":false,"fork":false,"pushed_at":"2022-03-03T15:17:44.000Z","size":1451,"stargazers_count":2715,"open_issues_count":30,"forks_count":459,"subscribers_count":50,"default_branch":"master","last_synced_at":"2024-11-09T18:42:00.618Z","etag":null,"topics":["android","android-library","material-design","pattern-library"],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aritraroy.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-03-27T18:46:20.000Z","updated_at":"2024-11-08T17:52:14.000Z","dependencies_parsed_at":"2022-08-09T08:37:08.611Z","dependency_job_id":null,"html_url":"https://github.com/aritraroy/PatternLockView","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aritraroy%2FPatternLockView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aritraroy%2FPatternLockView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aritraroy%2FPatternLockView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aritraroy%2FPatternLockView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aritraroy","download_url":"https://codeload.github.com/aritraroy/PatternLockView/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250064846,"owners_count":21368979,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","android-library","material-design","pattern-library"],"created_at":"2024-08-02T01:02:33.269Z","updated_at":"2025-04-21T13:32:35.866Z","avatar_url":"https://github.com/aritraroy.png","language":"Java","readme":"![PatternLockView](https://github.com/aritraroy/PatternLockView/blob/master/screenshots/pattern-lock-view-banner.png?raw=true)\n\n# PatternLockView\nAn easy-to-use, customizable, Material Design ready Pattern Lock view for Android.\n\n### Specs\n[ ![Download](https://api.bintray.com/packages/aritraroy/maven/patternlockview/images/download.svg) ](https://bintray.com/aritraroy/maven/patternlockview/_latestVersion) [![API](https://img.shields.io/badge/API-14%2B-orange.svg?style=flat)](https://android-arsenal.com/api?level=14) [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0) [![Android Arsenal](https://img.shields.io/badge/Android%20Arsenal-PatternLockView-brightgreen.svg?style=flat)](https://android-arsenal.com/details/1/5515)\n\n\nThis library allows you to implement pattern locking mechanism in your app **easily and quickly**. It is very easy to use and there are **plenty of customization options** available to change the functionality and look-and-feel of this view to match your needs.\n\nIt also **supports RxJava 2 view bindings**, so if you are a fan of reactive programming (just like me), you can get a stream of updates as the user draws the pattern.\n\n![PatternLockView](https://github.com/aritraroy/PatternLockView/blob/master/screenshots/pattern_lock_view_small.gif?raw=true) ![PatternLockView](https://github.com/aritraroy/PatternLockView/blob/master/screenshots/pattern_lock_view_2_small.gif?raw=true)\n\n\n# Download\n\nThis library is available in **jCenter** which is the default Maven repository used in Android Studio.\n\n## Gradle \n```gradle\ndependencies {\n    // other dependencies here\n    \n    compile 'com.andrognito.patternlockview:patternlockview:1.0.0'\n    // Optional, for RxJava2 adapter\n    compile 'com.andrognito.patternlockview:patternlockview-reactive:1.0.0'\n}\n```\n\n### Spread Some :heart:\n[![GitHub stars](https://img.shields.io/github/stars/aritraroy/PatternLockView.svg?style=social\u0026label=Star)](https://github.com/aritraroy) [![GitHub followers](https://img.shields.io/github/followers/aritraroy.svg?style=social\u0026label=Follow)](https://github.com/aritraroy)  \n[![Twitter Follow](https://img.shields.io/twitter/follow/aritraroy.svg?style=social)](https://twitter.com/aritraroy) \n\n\n# Usage\nWe recommend you to check the [sample project](https://github.com/aritraroy/PatternLockView/blob/master/app/src/main/java/com/andrognito/patternlockdemo/MainActivity.java) to get a complete understanding of the library. The step-by-step implementation guide is as follows.\n\n### Step 1\n\nPlace the view in your XML layout file.\n\n```xml\n    \u003ccom.andrognito.patternlockview.PatternLockView\n        android:id=\"@+id/pattern_lock_view\"\n        android:layout_width=\"280dp\"\n        android:layout_height=\"280dp\"/\u003e\n```\n\nThis is enough to get the view rendered in your layout. But you would certainly want to add a callback listener to listen to pattern changes.\n\n### Step 2\n\nReference the view in code and add a listener to it.\n\n```java\nmPatternLockView = (PatternLockView) findViewById(R.id.pattern_lock_view);\nmPatternLockView.addPatternLockListener(mPatternLockViewListener);\n```\n\nImplement the listener interface as follows,\n\n```java\nprivate PatternLockViewListener mPatternLockViewListener = new PatternLockViewListener() {\n        @Override\n        public void onStarted() {\n            Log.d(getClass().getName(), \"Pattern drawing started\");\n        }\n\n        @Override\n        public void onProgress(List\u003cPatternLockView.Dot\u003e progressPattern) {\n            Log.d(getClass().getName(), \"Pattern progress: \" +\n                    PatternLockUtils.patternToString(mPatternLockView, progressPattern));\n        }\n\n        @Override\n        public void onComplete(List\u003cPatternLockView.Dot\u003e pattern) {\n            Log.d(getClass().getName(), \"Pattern complete: \" +\n                    PatternLockUtils.patternToString(mPatternLockView, pattern));\n        }\n\n        @Override\n        public void onCleared() {\n            Log.d(getClass().getName(), \"Pattern has been cleared\");\n        }\n    };\n```\n\nAnd that's it! Your PatternLockView is ready to rock. You might also want to remove the listeners when not needed,         `removePatternLockListener(mPatternLockViewListener);`\n\n\n### Step 3 (Optional: ReactiveX Interface)\n\nFor the RxJava fanboys, this library supports RxJava 2 view bindings. You can subscribe to this view to get a stream of pattern change updates.\n\n```java\nRxPatternLockView.patternChanges(mPatternLockView)\n                .subscribe(new Consumer\u003cPatternLockCompoundEvent\u003e() {\n                    @Override\n                    public void accept(PatternLockCompoundEvent event) throws Exception {\n                        if (event.getEventType() == PatternLockCompoundEvent.EventType.PATTERN_STARTED) {\n                            Log.d(getClass().getName(), \"Pattern drawing started\");\n                        } else if (event.getEventType() == PatternLockCompoundEvent.EventType.PATTERN_PROGRESS) {\n                            Log.d(getClass().getName(), \"Pattern progress: \" +\n                                    PatternLockUtils.patternToString(mPatternLockView, event.getPattern()));\n                        } else if (event.getEventType() == PatternLockCompoundEvent.EventType.PATTERN_COMPLETE) {\n                            Log.d(getClass().getName(), \"Pattern complete: \" +\n                                    PatternLockUtils.patternToString(mPatternLockView, event.getPattern()));\n                        } else if (event.getEventType() == PatternLockCompoundEvent.EventType.PATTERN_CLEARED) {\n                            Log.d(getClass().getName(), \"Pattern has been cleared\");\n                        }\n                    }\n                });\n```\n\nIf you are not interested in getting the compound event, you should subscribe to `patternComplete()` and/or `patternProgress()` for the specific updates. Have a detailed look [here](https://github.com/aritraroy/PatternLockView/blob/master/patternlockview-rxadapter/src/main/java/com/andrognito/rxpatternlockview/RxPatternLockView.java).\n\n# Customization\n\nThere are several customization options available which you can use to completely change the look-and-feel and functionality of this view to match your needs.\n\n### XML (Quick and Easy)\n\nYou can add various attributes to the PatternLockView from your XML layout.\n\n```xml\n  app:dotCount=\"3\"                                        // Change the no.of dots in a row (or column)\n  app:dotNormalSize=\"12dp\"                                // Change the size of the dots in normal state\n  app:dotSelectedSize=\"24dp\"                              // Change the size of the dots in selected state\n  app:pathWidth=\"4dp\"                                     // Change the width of the path\n  app:aspectRatioEnabled=\"true\"                           // Set if the view should respect custom aspect ratio\n  app:aspectRatio=\"square\"                                // Set between \"square\", \"width_bias\", \"height_bias\"\n  app:normalStateColor=\"@color/white\"                     // Set the color of the pattern view in normal state\n  app:correctStateColor=\"@color/primary\"                  // Set the color of the pattern view in correct state\n  app:wrongStateColor=\"@color/pomegranate\"                // Set the color of the pattern view in error state     \n  app:dotAnimationDuration=\"200\"                          // Change the duration of the animating dots\n  app:pathEndAnimationDuration=\"100\"                      // Change the duration of the path end animaiton\n```\n\n### JAVA (Programatically)\n\nYou can also programatically change the properties of the view, thereby having more control over it.\n\n```java\nmPatternLockView.setViewMode(PatternLockView.PatternViewMode.CORRECT);       // Set the current viee more \nmPatternLockView.setInStealthMode(true);                                     // Set the pattern in stealth mode (pattern drawing is hidden)\nmPatternLockView.setTactileFeedbackEnabled(true);                            // Enables vibration feedback when the pattern is drawn\nmPatternLockView.setInputEnabled(false);                                     // Disables any input from the pattern lock view completely\n\nmPatternLockView.setDotCount(3);\nmPatternLockView.setDotNormalSize((int) ResourceUtils.getDimensionInPx(this, R.dimen.pattern_lock_dot_size));\nmPatternLockView.setDotSelectedSize((int) ResourceUtils.getDimensionInPx(this, R.dimen.pattern_lock_dot_selected_size));\nmPatternLockView.setPathWidth((int) ResourceUtils.getDimensionInPx(this, R.dimen.pattern_lock_path_width));\nmPatternLockView.setAspectRatioEnabled(true);\nmPatternLockView.setAspectRatio(PatternLockView.AspectRatio.ASPECT_RATIO_HEIGHT_BIAS); \nmPatternLockView.setNormalStateColor(ResourceUtils.getColor(this, R.color.white));\nmPatternLockView.setCorrectStateColor(ResourceUtils.getColor(this, R.color.primary));\nmPatternLockView.setWrongStateColor(ResourceUtils.getColor(this, R.color.pomegranate));\nmPatternLockView.setDotAnimationDuration(150);\nmPatternLockView.setPathEndAnimationDuration(100);\n\n```\n\n# Contribution\n\nThis library is inspired from AOSP's [LockPatternView](https://github.com/android/platform_frameworks_base/blob/master/core/java/com/android/internal/widget/LockPatternView.java). There are lots of improvements and customization options added so that you can get started without any hassle. If you find a bug or would like to improve any aspect of it, feel free to contribute with pull requests.\n\n\n# About The Author\n\n### Aritra Roy\n\nAndroid \u0026 Backend Developer. Blogger. Designer. Fitness Enthusiast.\n\n\u003ca href=\"https://play.google.com/store/apps/details?id=com.codexapps.andrognito\u0026hl=en\"\u003e\u003cimg src=\"https://github.com/aritraroy/social-icons/blob/master/play-store-icon.png?raw=true\" width=\"60\"\u003e\u003c/a\u003e \u003ca href=\"https://blog.aritraroy.in/\"\u003e\u003cimg src=\"https://github.com/aritraroy/social-icons/blob/master/medium-icon.png?raw=true\" width=\"60\"\u003e\u003c/a\u003e\n\u003ca href=\"http://stackoverflow.com/users/2858654/aritra-roy\"\u003e\u003cimg src=\"https://github.com/aritraroy/social-icons/blob/master/stackoverflow-icon.png?raw=true\" width=\"60\"\u003e\u003c/a\u003e\n\u003ca href=\"https://twitter.com/aritraroy\"\u003e\u003cimg src=\"https://github.com/aritraroy/social-icons/blob/master/twitter-icon.png?raw=true\" width=\"60\"\u003e\u003c/a\u003e\n\u003ca href=\"http://linkedin.com/in/aritra-roy\"\u003e\u003cimg src=\"https://github.com/aritraroy/social-icons/blob/master/linkedin-icon.png?raw=true\" width=\"60\"\u003e\u003c/a\u003e\n\n\n# License\n\n```\nCopyright 2017 aritraroy\n\nLicensed under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License.\nYou may obtain a copy of the License at\n\n   http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\nSee the License for the specific language governing permissions and\nlimitations under the License.\n```\n","funding_links":[],"categories":["PinCode"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faritraroy%2FPatternLockView","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faritraroy%2FPatternLockView","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faritraroy%2FPatternLockView/lists"}