Lockscreen

Lockscreen

iOS-like lockscreen with ease

$3.00

Not yet rated
Hieu Pham

Hieu Pham

Member since 2015

Details

Version:
1.0
Size:
9mb
Ionic:
1.x
Platforms:
iOS, Android, Windows Phone
View ID:
9794f028
Released:
5 years ago
Updated:
2 months ago
Category:
Plugins
Tags:
lockscreen, service, plugin, passcode

TakeThatDesign.com is my new home

Click the screenshot below to visit, don't forget to bookmark, and subscribe to my newsletter. See you there!

takethatdesign.com thumbnail

Ionic Lockscreen 1

Lockscreen Plugin

You can find Ionic Lockscreen 2 (Ionic 3) sold separately here.

Payment methods

Pay via Stripe using the button PURCHASE $3 on the side.

Other options:

Purchase Externally

If you want to Paypal directly, please let me know the name of the item by sending me an email mr_hie@yahoo.com before you process the payment. Thanks.

Purchase Externally

Introduction

Lockscreen (not login screen) made easy with this plugin. You will have a beautiful and minimal lockscreen out of the box. The use cases might be: lock the access to a particular route or function, lock sensitive information, or typically be the very first screen for your diary/journal/finance app.

It comes as a angularjs service which is dead easy to integrate with your working project.

Support TouchID (iOS)

Tested on iPhone 6s+.

Preview

Watch on Youtube

See how it works on Youtube: https://youtu.be/xUiGCpnUDzQ

See more

You might like my collection of Ionic products. See more at https://market.ionic.io/user/66136

See more of my works

Happy prototyping!

enter image description here

Changelog

Note: All updates are on Ionic 1

Last updated: Jun 17 2017

v1

  • First version

v2

  • Remove constant.DEFAULT_LENGTH, use passcode.length instead

v3

  • Now integrate TouchID on iOS devices that supports

v4

  • Optional back button with custom function

v5

  • Compatible with Ionic CLI ~3.4.0
  • Package with all versions in one

Screens

  1. Built-in numpad, consistent look on different the platforms
  2. Vibrate the phone if entering the incorrect passcode
  3. Configurable default length of the passcode
  4. Written as a service
  5. Support TouchID (on supported iOS devices)

Run locally

1.Install Ionic environment

$ npm install -g cordova@9.0.0
$ npm install -g ionic@4.12.0

2.After purchasing, download the zip file containing the entire demo app and unzip

3.Go inside the extracted folder

4.Install all dependencies

$ npm install
$ bower install

5.Start local server

$ ionic serve

6.Your default browser should now automatically open the template

Notes

Inside lockscreen.js

Modify the default values

.constant('constant', {
    THEME: 'button-outline button-assertive'
  })

In your controller

.controller('homeCtrl', function($scope, Lockscreen) {
    $scope.state = {
      correctPasscode: '1234',
      useTouchId: false
    }

    $scope.showLockscreen = function() {
      Lockscreen.open({
        passcode: $scope.state.correctPasscode, // The correct passcode to pass into lockscreen directive
        useTouchId: $scope.state.useTouchId // default: false
        showBackButton: true, // default: false
        backFunc: function() {
          console.log('Go back to last state or do something');
        }
      }).then(function() {
        console.log('Correct!');
      })
    }
  })

Dependencies

If you want to integrate this plugin into your project, don't forget these dependencies:

  1. ngCordova $ bower install ngCordova --save

  2. $cordovaVibration $ cordova plugin add cordova-plugin-vibration —save

  3. $cordovaTouchID cordova plugin add https://github.com/leecrossley/cordova-plugin-touchid.git —save

  4. CSS file path ./scss/lockscreen.sass

  5. JS file path ./www/js/lockscreen.js

Contact

If you need technical support or have any questions, don't hesitate to send me a message: mr_hie@yahoo.com

Homepage: https://www.takethatdesign.com

[PROMO] Ionic 4 Bundle: 4 in 1 - Best Seller

My best Ionic 4 products (3 themes + 1 plugin) are now on sale with promotion code BUNDLE4. Please click the button below for more information.

Purchase Externally

Hey there! You'll need to log in before you can leave a comment here.

jeisson

jeisson   ·   4 years ago

Hi, I purchased this component and all work OK but I have a problem, when implement setting passcode with repeat code. thank

Hieu Pham

Hieu Pham   ·   4 years ago

I'm sorry I don't get it? Can you send an email to me mr_hie@yahoo.com?

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Dan Giacopelli

Dan Giacopelli   ·   4 years ago

I purchased this component last week and had a few issues with it's feature set, all due to my particular use of the component and not due to any flaw in the basic component. Hieu went above and beyond the call of duty to help me through my issue, going as far as suggesting ways to modify the component code to make it perform to my requirement. Well done Hieu! I strongly recommend both this component and Hieu as a component vendor.

Hieu Pham

Hieu Pham   ·   4 years ago

Thanks for your kind words Dan! Hope you're doing great!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Michael Keith

Michael Keith   ·   4 years ago

Hi is this work on android too? how about phone with thumb verification ?

Hieu Pham

Hieu Pham   ·   4 years ago

It relies on the Touch ID plugin so it only works with iOS so far. I don't have android device to test that

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Buddhi

Buddhi   ·   2 years ago

hi there, I just purchased this component but I did not get any download link. Can you please help.

Hieu Pham

Hieu Pham   ·   2 years ago

Hi, there must be some issues with Market Ionic. I've seen your stripe payment. Can you double check at your Market Ionic account section if there is a download link? Otherwise please drop me an email: mr_hie@yahoo.com. I'll provide support from there. Thanks!

Buddhi

Buddhi   ·   2 years ago

Finally, download link appeared, but I more thing, is there, we can make this full-screen lock instead of modal?

Hieu Pham

Hieu Pham   ·   2 years ago

Oh nice. For the full-screen option, I don't get it by "fullscreen lock". I assume that you're talking about putting it in a different page (state). You will need to modify the code yourself to fit your need. Thanks.

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

  ·   just now

{{ comment.comment }}

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

  ·   just now

{{ comment.comment }}

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Buddhi

Buddhi   ·   2 years ago

hi there, I just purchased this component but I did not get any download link. Can you please help.

Hieu Pham

Hieu Pham   ·   2 years ago

Hi, there must be some issues with Market Ionic. I've seen your stripe payment. Can you double check at your Market Ionic account section if there is a download link? Otherwise please drop me an email: mr_hie@yahoo.com. I'll provide support from there. Thanks!

Buddhi

Buddhi   ·   2 years ago

Finally, download link appeared, but I more thing, is there, we can make this full-screen lock instead of modal?

Hieu Pham

Hieu Pham   ·   2 years ago

Oh nice. For the full-screen option, I don't get it by "fullscreen lock". I assume that you're talking about putting it in a different page (state). You will need to modify the code yourself to fit your need. Thanks.

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Michael Keith

Michael Keith   ·   4 years ago

Hi is this work on android too? how about phone with thumb verification ?

Hieu Pham

Hieu Pham   ·   4 years ago

It relies on the Touch ID plugin so it only works with iOS so far. I don't have android device to test that

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Dan Giacopelli

Dan Giacopelli   ·   4 years ago

I purchased this component last week and had a few issues with it's feature set, all due to my particular use of the component and not due to any flaw in the basic component. Hieu went above and beyond the call of duty to help me through my issue, going as far as suggesting ways to modify the component code to make it perform to my requirement. Well done Hieu! I strongly recommend both this component and Hieu as a component vendor.

Hieu Pham

Hieu Pham   ·   4 years ago

Thanks for your kind words Dan! Hope you're doing great!

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

jeisson

jeisson   ·   4 years ago

Hi, I purchased this component and all work OK but I have a problem, when implement setting passcode with repeat code. thank

Hieu Pham

Hieu Pham   ·   4 years ago

I'm sorry I don't get it? Can you send an email to me mr_hie@yahoo.com?

  ·   just now

{{ reply.comment }}



Hey there! You'll need to log in before you can leave a comment here.

Hey there! You'll need to log in and purchase the add-on before you can leave a rating here.

There are no ratings for this plugin yet

  ·     ·   just now

{{ rating.comment }}

  ·     ·   just now

{{ rating.comment }}