react-native-slide-to-unlock
A small button component inspired by old iPhone's feature 'slide to unlock'.
What it looks like
Installing
npm install --save react-native-slide-to-unlock
Usage
Example import
import Slider from 'react-native-slide-to-unlock';Example usage and props! They're self explaining.
<Slider
childrenContainer={{ backgroundColor: 'red' }}
onEndReached={() => {
Alert.alert('Attention', 'onEndReached!');
}}
containerStyle={{
margin: 8,
backgroundColor: 'white',
borderRadius: 10,
overflow: 'hidden',
alignItems: 'center',
justifyContent: 'center',
width: '95%'
}}
sliderElement={
<Image
style={{
width: 50,
margin: 4,
borderRadius: 5,
height: 50,
backgroundColor: 'red',
}}
source={{
uri:
'https://facebook.github.io/react-native/docs/assets/favicon.png',
}}
/>
}
>
<Text>{'SLIDE TO UNLOCK'}</Text>
</Slider>Contributing
Feel free to contribute to this project at any time. Fixing issues or developing new features. Just a small example on how to contribute on this project.
cd yourReactNativeProject
git clone https://github.com/gutioliveira/react-native-slide-to-unlock.git ./yourComponentsFolder/react-native-slide-to-unlock
import it from your project
import Slider from './yourComponentsFolder/react-native-slide-to-unlock';start hacking and after you're done, submit your pull request.
