nabta-pulldown-animation

Pulldown animation that changes calendar from Hijro to Greogorian and Vice Versa

Usage no npm install needed!

<script type="module">
  import nabtaPulldownAnimation from 'https://cdn.skypack.dev/nabta-pulldown-animation';
</script>

README

Nabta-PullDown-Animation!

This is documentation for Nabta-PullDown-Animation. Author: Ahmed Sharaf.

Installation Guide

npm install nabta-pulldown-animation

Please note that you need to MANUALLY install ONLY IF NOT INSTALLED the following packages:

npm install react-native-reanimated

react-native-redash

react-native-svg

react-native-gesture-handler

react-native-vector-icons

Also note that some of this libraries may need manual linking so look at their documentation if any error occurred.

HOW TO USE

First import the package.

import PullDownAnimation from 'nabta-pulldown-animation

Then use it like that

<PullDownAnimation />

Available Props

Prop Name Describtion Type Default Value
topOffset Defines the offset of the pull down animation from top edge of the screen, typically will be the app bar height to be set right after it Number 26
size Defines the max size of the pull down animation means the max height it can reach Number SCREEN_HEIGHT * 0.15
fillColor The color of the pulled down area String (Color) "#000000"
rtl Whether the app is in RTL (Arabic) or not boolean false
arrowColor Color of the arrow icon String (Color) "white"
arrowSize Size of the arrow icon Number 12
onDragComplete A callback function that is triggered when the pulldown in completed and the pulled down area is started to go back function() () => {console.log("Drag Done")}
onHeightChange A callback function that is continuosly being triggered whenever the user drags the pulldown, it takes the current height as a first parameter funcntion(height) (_height) => {console.log(_height)}