0.0.8 • Published 7 months ago

@erickcrus/three-dots-loader v0.0.8

Weekly downloads
-
License
MIT
Repository
github
Last release
7 months ago

@erickcrus/three-dots-loader

A lightweight react-native three-dots-loader

Installation

npm install @erickcrus/three-dots-loader

Usage

import React, { useState } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import Loader from '@erickcrus/three-dots-loader';

const AppScreen = () => {
    const [ loading, setLoading ] = useState(false);

    const onPress = () => {
        setLoading(true);
        setTimeout(() => {
            setLoading(false);
        }, 1250);
    }

    return <View style={{ flex:1 }}>
        <View style={{ flex:1 }}>
            <Text>Press button to test</Text>
        </View>
        <TouchableOpacity style={{
            flex:0,
            backgroundColor: '#00b9fc',
            paddingVertical:10,
            width:'82%',
            alignSelf: 'center',
            borderRadius: 10
        }} onPress={onPress}>
            {loading ?
                <Loader size={8} color='#FFF' /> :
                <Text style={{color:'#FFF'}}>Test</Text>}
        </TouchableOpacity>
    </View>;
}

Properties

PropTypeDefaultDescription
sizenumberrequiredSize of dots
animationDurationnumber600Animation duration in ms
colorstring#00b9fcDots color
spacingnumber3Dots horizontal margin

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

0.0.8

7 months ago

0.0.7

8 months ago

0.0.6

1 year ago

0.0.5

1 year ago

0.0.4

1 year ago

0.0.3

1 year ago

0.0.2

1 year ago

0.0.1

1 year ago