1.0.0 • Published 2 years ago

@nativescript-community/ui-vue-unlock-slider v1.0.0

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

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.

npm

Installation

ns plugin add @nativescript-community/ui-vue-unlock-slider

Usage

// app.js
import Vue from 'nativescript-vue'
...
+ import UnlockSlider from '@nativescript-community/ui-vue-unlock-slider'
+ Vue.use(UnlockSlider)
<UnlockSlider ref="unlockSlider" @change="sliderChange" />
export default {
  data() {
    return {
      slidePercent: 0
    }
  },
  methods: {
    sliderChange(percent) {
      this.slidePercent = percent;
    },
    reset() {
      this.$refs.unlockSlider.reset();
    }
  }
}

Properties

NameTypeDefault value
heightNumber70
radiusNumber70
containerBackgroundColorStringlightgray
buttonTextString
buttonTextSizeNumber20
buttonTextColorStringblack
buttonTextFontWeightStringnormal
buttonBackgroundColorStringwhite
infoTextStringSlide to unlock
infoTextSizeNumber16
infoTextColorStringblack

Events

NameTypeValue
changeNumber0.00-1.00