nativescript-loading-screen
by loren.dorez | v1.0.6
A loading screen plugin for Nativescript for both Android and iOS.
npm i --save nativescript-loading-screen

Nativescript Loading Screen apple android

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