Skip to content
NativeScript plugin for a slick liquid loading animation.
TypeScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
demo
platforms/android
screens
.gitignore
.npmignore
LICENSE
README.md
liquidloader.android.ts
liquidloader.d.ts
liquidloader.ios.ts
package.json
tsconfig.json

README.md

npm npm

NativeScript-Liquid-Loader

Nativescript plugin for a slick liquid loading animation.

Android Only - API 18+

IMPORTANT

To use this plugin you need to modify the AndroidManifest.xml located in App_Resources/Android. You need the tools namespace, xmlns:tools="http://schemas.android.com/tools", added to the top of the file in the <manifest> tag.

You also need to add tools:overrideLibrary="com.gospelware.liquidbutton" to the <uses-sdk> tag.

For more info see the AndroidManifest.xml in the demo app.

Sample

Demo

Native Library

LiquidButton

Installation

From your command prompt/termial go to your app's root folder and execute:

tns plugin add nativescript-liquid-loader

Usage

XML:

<Page 
  xmlns="http://schemas.nativescript.org/tns.xsd" 
  xmlns:LiquidLoader="nativescript-liquid-loader" 
  loaded="pageLoaded">
  <ActionBar title="Liquid Loader" />
  <StackLayout>

    <LiquidLoader:LiquidLoader id="liquidLoader" height="400" pourFinish="{{ pourFinished }}" />

    <Button text="Start Animation" tap="{{ startThePour }}" />

  </StackLayout>
</Page>

API

  • startPour() - Starts the animation.
  • pourFinish() - Event executed when the animation finishes.
You can’t perform that action at this time.