nativescript-loading-screen
A loading screen plugin for Nativescript for both Android and iOS.
npm i --save nativescript-loading-screen
- Version: 1.0.6
- GitHub:
- NPM: https://www.npmjs.com/package/nativescript-loading-screen
- Downloads:
- Last Day: 0
- Last Week: 0
- Last Month: 0
Nativescript Loading Screen
This is my first plugin so please be kind :) :P
This plugin add a loading screen to both iOs and Android Apps.
Installation
tns plugin add nativescript-loading-screen
Usage
import { Observable } from 'tns-core-modules/data/observable';
import { LoadingScreen } from 'nativescript-loading-screen';
export class HelloWorldModel extends Observable {
private loadingScreen: LoadingScreen;
constructor() {
super();
}
public showLoading() {
this.loadingScreen = new LoadingScreen();
this.loadingScreen.show({
title: "test",
message: "loading..."
});
setTimeout(() => {
this.loadingScreen.updateMessage("Loading Change");
}, 5000);
setTimeout(() => {
this.loadingScreen.close();
const topmost = frameModule.topmost();
topmost.navigate("details-page");
}, 10000);
}
}
If you plan to nativate after closing the loading screen you must do it in the resolved promise on iOS. See example below
this.loadingScreen.close().then((result) => {
console.log(`Result => ${result}`);
});
API
Method | Return | Description |
---|---|---|
show(options?: Options) | Promise<bool> |
shows the loading screen |
update(options?: Options) | Promise<bool> |
updates the message & title |
updateMessage(message: string) | Promise<bool> |
updates the message |
updateTitle(title: string) | Promise<bool> |
updates the title |
close() | Promise<bool> |
closes the loading screen |
Options
Property | Type | Default | Description |
---|---|---|---|
title | string | [blank] |
title used for the loading screen |
message | string | loading... |
message using for the loading screen |
License
Apache License Version 2.0, January 2004
Credit
I got the idea to make this plugin from nativescript-dialog
written by Vladimir Enchev @enchev