Nuanced Pumpkin Mavens

    rn-topbutton-animation

    1.0.8 • Public • Published

    rn-topbutton-animation

    Node.js



    Arwy Syahputra Siregar's DEV Profile
    https://www.npmjs.com/package/rn-topbutton-animation

    BUILD SETUP

    ## Installation
    Version 1.0.8
    
    npm install rn-topbutton-animation --save
    
    
    

    USAGE

    import React from 'react';
    import {View, Text, Image} from 'react-native';
    import {HeaderSlide} from 'rn-topbutton-animation';
    import {globalStyle, width, height} from '../components/styles';
    
    export default function Check({navigation}) {
      function renderFirstItem() {
        return (
          <View
            style={{
              justifyContent: 'center',
              alignItems: 'center',
              top: width / 4,
            }}>
            <Image
              source={require('../../assets/notfound.jpg')}
              style={{
                justifyContent: 'center',
                height: height * 0.5,
                resizeMode: 'center',
                top: height / 4,
              }}
            />
          </View>
        );
      }
      function renderSecondItem() {
        return (
          <View
            style={{
              justifyContent: 'center',
              alignItems: 'center',
              top: width / 4,
            }}>
            <Text>Hello world2</Text>
          </View>
        );
      }
      function renderThirdItem() {
        return (
          <View
            style={{
              justifyContent: 'center',
              alignItems: 'center',
              top: width / 4,
            }}>
            <Text>Hello world3</Text>
            <Text>I Just Built this package</Text>
          </View>
        );
      }
      function renderFourthItem() {
        return (
          <View
            style={{
              justifyContent: 'center',
              alignItems: 'center',
              top: width / 4,
            }}>
            <Text>Hello world4</Text>
            <Text>I am Software Engineer</Text>
          </View>
        );
      }
      const data = ['article', 'foto',];
      return (
        <View>
          <HeaderSlide
            title={data}
            renderFirstItem={renderFirstItem}
            renderSecondItem={renderSecondItem}
            renderThirdItem={renderThirdItem}
            renderFourthItem={renderFourthItem}
          />
        </View>
      );
    }

    Current API(Property)

    Property Type Description
    renderFirstItem function (required) render component
    renderSecondItem function (required) render component
    renderThirdItem function (optional) render component
    renderFourthItem function (optional) render component
    title PropTypes.Array (required) button title
    buttonColor PropTypes.String (optional) color for button

    note : the amount of render item must same with the length of title. title must have length at least 2 and maximum 4

    Project Documentation

    • Author Account
    Arwy Syahputra Siregar
    github.com/arwysyah
    

    Copyright ©

    by Arwy Syahputra Siregar

    Install

    npm i rn-topbutton-animation

    DownloadsWeekly Downloads

    2

    Version

    1.0.8

    License

    ISC

    Unpacked Size

    459 kB

    Total Files

    8

    Last publish

    Collaborators

    • arwysyah