- Supports Touch ID on iOS using cordova-plugin-touchid
- Customizable
$ npm install ionic-lock-screen --save
$ bower install ionic-lock-screen --save
Include as a dependency in your angular module
angular.module('myApp', ['ionic-lock-screen'])
Add the directive as the first element in your app container element:
<body ng-app="myApp">
<lock-screen></lock-screen>
...
</body>
Load whenever the app is opened:
.run(['$lockScreen', $ionicPlatform, function($lockScreen, $ionicPlatform) {
$ionicPlatform.ready(function() {
$lockScreen.show({
code: '1234',
onCorrect: function () {
console.log('correct!');
},
onWrong: function (attemptNumber) {
console.log(attemptNumber + ' wrong passcode attempt(s)');
},
});
});
}]);
AC(All Clear) button and Del button is also available:
$lockScreen.show({
code: '1234',
ACDelbuttons: true,
});
Set a button at the bottom of the screen: (useful to let user cancel or logout)
$lockScreen.show({
code: '1234',
bottomButton: true,
bottomButtonLabel: 'Logout', //text written in button
onCorrect: function() {
//some code
},
onBottomButton: function(){
//logout action
}
})
Use the lockscreen to set a new passcode:
//do not set the code parameter as seen in examples above
$lockScreen.show({
onCorrect: function(newCode) {
//use the newCode var here
}
})
Use the maxAttempts parameter:
$lockScreen.show({
code: '1234',
maxAttempts: 5,
onCorrect: function() {
//some code
},
onWrong: function() {
//this code will only be triggered after 5 fails
}
})
You can also trigger the lock screen on the resume and pause events.
Install cordova-plugin-touchid
$ cordova plugin add cordova-plugin-touchid --save
Set touchId:true
$lockScreen.show({
code: '1234',
touchId: true,
});
See available options here.
MIT