Skip to content

A fork of a simple library loading dots component with TypeScript.

License

Notifications You must be signed in to change notification settings

mxtheussouza/react-native-loading-ellipsis

 
 

Repository files navigation

React Native Loading Ellipsis


A fork of a simple library loading dots component.


Installation

npm:

npm install --save @matheusdearaujo/react-native-loading-ellipsis

yarn:

yarn add @matheusdearaujo/react-native-loading-ellipsis

Usage

import EllipsisLoading from "@matheusdearaujo/react-native-loading-ellipsis"

Simply place a <EllipsisLoading /> inside of any compnent.

<View style={{ flex: 1 }}>
    <EllipsisLoading />
</View>

Styling Usage

EllipsisLoading is fully customizable using the styleDot, animationDelay, numberOfDots, minOpacity, and dotSize props.

Example usage to change dots color and spacing (as preview):

<View style={{ flex: 1 }}>
    <EllipsisLoading
        styleDot={{
          backgroundColor: "#6c5ce7",
          margin: 5,
        }}
    />
</View>

Documentation

EllipsisLoading Component

Name Description Default Type
styleDot Dot styles undefined ViewStyle
animationDelay Delay for animation in milliseconds 300 Number
numberOfDots Number of dot to display 3 Number
minOpacity Opacity of dot animation 0.2 Number
dotSize Size of the dots 12 Number

How to contribute

Read our contribution guide.

Contributors

Author


@mxtheussouza

LICENSE

This repository use MIT License.

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 89.3%
  • JavaScript 8.8%
  • Shell 1.9%