Ionic-lock-screen - add a passcode lock screen to your app

tutorials
1

ionic-lock-screen lets you add a passcode lock screen to your app.

ionic-lock-screen.gif304×540

Add the directive as the first element in your app container element:

<lock-screen></lock-screen>

Then use the $lockScreen service to show the lock screen:

$lockScreen.show({
  code: '1234',
  onCorrect: function () {
    console.log('correct!');
  },
  onWrong: function (attemptNumber) {
    console.log(attemptNumber + ' wrong passcode attempt(s)');
  },
});

Check the repository for more info: https://github.com/AlexDisler/ionic-lock-screen

2 Likes
2

This looks awesome - not sure if you’ve already thought about this, but I need a way to use this screen to also generate the passcode - have you had a look at this? If not, will give this a go myself.

3

Hi, I followed the install instructions, but only getting this error now:

Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:

Error: [$injector:modulerr] Failed to instantiate module ionic-lock-screen due to:

Error: [$injector:nomod] Module ‘ionic-lock-screen’ is not available!
You either misspelled the module name or forgot to load it. If
registering a module ensure that you specify the dependencies as the
second argument.

Am I doing something wong? Thank you!

4

Hi basti,

Use bower installation. After the installation in your index.html file add this
<script src="lib/ionic-lock-screen/dist/index.js"></script>

See the magic.

Hope it helps!!

5

Did you add generate passcode module to the existing plugin ?
I am looking at cordova-pin-dialog plugin from ngcordova to generate passcode and then use this module but CSS doesn’t match and UX doesn’t seem good! Looks like we have to change css to match both!

6

Do you guys know if have the same plugin to Ionic 2?

1 Like
7

I’m also interested in an ionic 2 version!

1 Like
8

Hi,

For ionic version: https://github.com/CarsonChen1129/ionic2-lock-screen

9

Hi,

For ionic2 version, https://github.com/CarsonChen1129/ionic2-lock-screen

2 Likes