https://github.com/nativescript-community/ui-vue-unlock-slider
A NativeScript-Vue component for "Slide to unlock"
https://github.com/nativescript-community/ui-vue-unlock-slider
Last synced: 9 months ago
JSON representation
A NativeScript-Vue component for "Slide to unlock"
- Host: GitHub
- URL: https://github.com/nativescript-community/ui-vue-unlock-slider
- Owner: nativescript-community
- License: mit
- Created: 2021-12-09T03:38:56.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2021-12-10T14:56:41.000Z (over 4 years ago)
- Last Synced: 2025-08-04T07:07:09.093Z (10 months ago)
- Language: Vue
- Size: 69.3 KB
- Stars: 13
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# A NativeScript-Vue component for "Slide to unlock"
Slide to unlock in iOS style with animations made with NativeScript-Vue. Works on iOS and Android.
[](https://www.npmjs.com/package/@nativescript-community/ui-vue-unlock-slider)
## Installation
```
ns plugin add @nativescript-community/ui-vue-unlock-slider
```
## Usage
```diff
// app.js
import Vue from 'nativescript-vue'
...
+ import UnlockSlider from '@nativescript-community/ui-vue-unlock-slider'
+ Vue.use(UnlockSlider)
```
```xml
```
```js
export default {
data() {
return {
slidePercent: 0
}
},
methods: {
sliderChange(percent) {
this.slidePercent = percent;
},
reset() {
this.$refs.unlockSlider.reset();
}
}
}
```
## Properties
| Name | Type | Default value |
| ------------------------ | ------ | --------------- |
| height | Number | 70 |
| radius | Number | 70 |
| containerBackgroundColor | String | lightgray |
| buttonText | String | → |
| buttonTextSize | Number | 20 |
| buttonTextColor | String | black |
| buttonTextFontWeight | String | normal |
| buttonBackgroundColor | String | white |
| infoText | String | Slide to unlock |
| infoTextSize | Number | 16 |
| infoTextColor | String | black |
## Events
| Name | Type | Value |
| -------| ------ | ------- |
| change | Number | 0.00-1.00 |