Installation
tns plugin add nativescript-awesome-loaders
Usage
;let al = ;
Set Width
al.width = 60
Set Height
al.height = 60
Set Indicator
al.indicator = "Pacman"
Set Indicator Color
al.indicatorColor= "#FFEB3B"
TypeScript
; ; al.width = 60; al.height = 60; al.indicator = "SemiCircleSpin"; al.indicatorColor= "black";
JavaScript
var AwesomeLoaders = AwesomeLoaders; let li = ; alwidth = 60; alheight = 60; alindicator = "SemiCircleSpin"; alindicatorColor= "black";
Xml markup settings
IMPORTANT: Make sure you include xmlns:al="nativescript-awesome-loaders" on the Page element
e.g
<al:AwesomeLoaders width="60" height="60" indicator="Pacman" indicatorColor="#FFEB3B" />
Screenshot
Indicators
As seen above in the Screenshot, the indicators are as follows:
Row 1
BallPulse
BallGridPulse
BallClipRotate
BallClipRotatePulse
Row 2
SquareSpin
BallClipRotateMultiple
BallPulseRise
BallRotate
Row 3
CubeTransition
BallZigZag
BallZigZagDeflect
BallTrianglePath
Row 4
BallScale
LineScale
LineScaleParty
BallScaleMultiple
Row 5
BallPulseSync
BallBeat
LineScalePulseOut
LineScalePulseOutRapid
Row 6
BallScaleRipple
BallScaleRippleMultiple
BallSpinFadeLoader
LineSpinFadeLoader
Row 7
TriangleSkewSpin
Pacman
BallGridBeat
SemiCircleSpin