From ff0207657cdcb35cf31112352cb0455a1ec5f2a3 Mon Sep 17 00:00:00 2001 From: Nikolay Iliev Date: Tue, 23 Apr 2019 13:21:46 +0300 Subject: [PATCH] docs: extend application article --- .../application-events.component.html | 6 ++ .../application-events.component.ts | 92 +++++++++++++++++++ .../application/application-events/article.md | 31 +++++++ .../application-examples.component.ts | 1 + .../application-examples.module.ts | 6 ++ 5 files changed, 136 insertions(+) create mode 100644 app/ng-framework-modules-category/application/application-events/application-events.component.html create mode 100644 app/ng-framework-modules-category/application/application-events/application-events.component.ts create mode 100644 app/ng-framework-modules-category/application/application-events/article.md diff --git a/app/ng-framework-modules-category/application/application-events/application-events.component.html b/app/ng-framework-modules-category/application/application-events/application-events.component.html new file mode 100644 index 00000000..05aefbbb --- /dev/null +++ b/app/ng-framework-modules-category/application/application-events/application-events.component.html @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/app/ng-framework-modules-category/application/application-events/application-events.component.ts b/app/ng-framework-modules-category/application/application-events/application-events.component.ts new file mode 100644 index 00000000..cb25ee48 --- /dev/null +++ b/app/ng-framework-modules-category/application/application-events/application-events.component.ts @@ -0,0 +1,92 @@ +import { Component } from "@angular/core"; + +import { + on, + ApplicationEventData, + launchEvent, LaunchEventData, + resumeEvent, + exitEvent, + uncaughtErrorEvent, UnhandledErrorEventData, + displayedEvent, + lowMemoryEvent, + orientationChangedEvent, OrientationChangedEventData, + suspendEvent +} from "tns-core-modules/application"; + +let launchListener, + suspendListener, + resumeListener, + exitListener, + displayedListener, + lowMemoryListener, + orientationChangedListener, + uncaughtErrorListener; + +@Component({ + moduleId: module.id, + templateUrl: "./app-checking-target.component.html" +}) +export class ApplicationEventsComponent { + public isItemVisible: boolean; + + constructor() { + // >> application-events-launch-ng + launchListener = (args: LaunchEventData) => { + console.log("The appication was launched!"); + }; + on(launchEvent, launchListener); + // << application-events-launch-ng + + // >> application-events-suspend-ng + suspendListener = (args: ApplicationEventData) => { + console.log("The appication was suspended!"); + }; + on(suspendEvent, suspendListener); + // << application-events-suspend-ng + + // >> application-events-resume-ng + resumeListener = (args: ApplicationEventData) => { + console.log("The appication was resumed!"); + }; + on(resumeEvent, resumeListener); + // << application-events-resume-ng + + // >> application-events-exit-ng + exitListener = (args: ApplicationEventData) => { + console.log("The appication was closed!"); + }; + on(exitEvent, exitListener); + // << application-events-exit-ng + + // >> application-events-displayed-ng + displayedListener = (args: ApplicationEventData) => { + console.log("NativeScript displayedEvent!"); + }; + on(displayedEvent, displayedListener); + // << application-events-displayed-ng + + // >> application-events-low-memory-ng + lowMemoryListener = (args: ApplicationEventData) => { + // the instance that has raised the event + console.log("Instance: ", args.object); + }; + on(lowMemoryEvent, lowMemoryListener); + // << application-events-low-memory-ng + + // >> application-events-orientation-ng + orientationChangedListener = (args: OrientationChangedEventData) => { + // orientationChangedEventData.newValue: "portrait" | "landscape" | "unknown" + console.log("Orientation: ", args.newValue); + }; + on(orientationChangedEvent, orientationChangedListener); + // << application-events-orientation-ng + + // >> application-events-error-ng + uncaughtErrorListener = (args: UnhandledErrorEventData) => { + // UnhandledErrorEventData.error: NativeScriptError + console.log("NativeScript Error: ", args.error); + }; + on(uncaughtErrorEvent, uncaughtErrorListener); + // << application-events-error-ng + } +} diff --git a/app/ng-framework-modules-category/application/application-events/article.md b/app/ng-framework-modules-category/application/application-events/article.md new file mode 100644 index 00000000..c0b543ed --- /dev/null +++ b/app/ng-framework-modules-category/application/application-events/article.md @@ -0,0 +1,31 @@ + +The application module provides cross-platform application events to handle different application states. +With the provided application events the user can handle launch, resume, suspend and exit states or provide logic +related to the screen orientation, uncaught errors and low memory events. + +Use the application method `on` to add event listeners. + +### Launch Event + + +### Suspend Event + + +### Resume Event + + +### Exit Event + + +### Displayed Event + + +### Low Memory Event + + +### Orientation Changed Event + + +### Uncaught Error Event + + diff --git a/app/ng-framework-modules-category/application/application-examples.component.ts b/app/ng-framework-modules-category/application/application-examples.component.ts index c52d98bc..9ea10993 100644 --- a/app/ng-framework-modules-category/application/application-examples.component.ts +++ b/app/ng-framework-modules-category/application/application-examples.component.ts @@ -5,6 +5,7 @@ let menuLinks = [ new Link("Checking Target Platform", "/application/check-target"), new Link("Using Android Specifics", "/application/using-android"), new Link("Using iOS Specifics", "/application/using-ios"), + new Link("Application Events", "/application/application-events") ]; @Component({ diff --git a/app/ng-framework-modules-category/application/application-examples.module.ts b/app/ng-framework-modules-category/application/application-examples.module.ts index 8379dc77..ec5873ae 100644 --- a/app/ng-framework-modules-category/application/application-examples.module.ts +++ b/app/ng-framework-modules-category/application/application-examples.module.ts @@ -5,6 +5,7 @@ import { ApplicationExamplesComponent } from "./application-examples.component"; import { AppCheckingTargetExampleComponent } from "./app-checking-target/app-checking-target.component"; import { AppUsingAndroidExampleComponent } from "./app-using-android-specifics/app-using-android-specifics.component"; import { AppUsingIosExampleComponent } from "./app-using-ios-specifics/app-using-ios-specifics.component"; +import { ApplicationEventsComponent } from "./application-events/application-events.component"; import { TitleAndNavButtonModule } from "../../directives/title-and-nav-button.module"; export const routerConfig = [ @@ -26,6 +27,11 @@ export const routerConfig = [ path: "using-ios", component: AppUsingIosExampleComponent, data: { title: "Using iOS Specifics" } + }, + { + path: "application-events", + component: ApplicationEventsComponent, + data: { title: "Application Events" } } ];