UserInterfaceService
UserInterfaceService TypeScript Class Reference

Overview

SERVICE This class is a "service" and it is automatically injected if declared as a member in the constructor of the consuming class. - See the constructor section below for details - See the Automatic Instance Injection page for details on the topic
The UserInterfaceService class provides methods to manage the user interface of the application. It is used mostly to drive the navigation between steps within the current UI task.
Properties
Methods
Constructor
Platforms
App Types
No properties
Don't instantiate directly instances of the UserInterfaceService class. UserInterfaceService instances are automatically injected by Dynamics Mobile framework.
1
import {View, UserInterfaceService} from '$dms';
2
3
@View()
4
export class MyView {
5
6
constructor(
7
//we need to only declare the member
8
private UserInterfaceService: ContextService
9
){
10
11
}
12
13
async load(){
14
//we can now use the injected instance
15
this.UserInterfaceService.cancel();
16
}
17
18
}
Copied!
📳
Devices: All
Clouds: All
📳
Mobile
🌐
Backend

navigate(routeId: string): void

Description
Parameters
Returns
Example
Executes UI navigation a route. If the route is "validating", the framework will call the current view's validate and commit methods. It will call then the final method and will initiate the rendering process of the view targeted by the route. This is the most frequently used method to navigate between steps in the current UI task.
    routeId: string The id of the route to which the framework shall navigate. The route id must be defined in the current task JSON definition. If the routeId is non-existing, the navigate method will fail silently - e.g. no navigation will occur as well as no error will be thrown.
void
1
this.UserInterfaceService.navigate('next');
Copied!
Do not place code after the navigate method as the navigation transition might cause unpredictable results from the code executed after.

cancel(): void

Description
Parameters
Returns
Example
Cancels the current UI task and navigates back to the Home task
there are no parameters
void
1
this.UserInterfaceService.cancel();
Copied!
Do not place code after the cancel method as the navigation transition might cause unpredictable results from the code executed after.

launchTask(taskId: string, stepId: string, preserveContext: boolean): void

Description
Parameters
Returns
Example
Starts UI task with given id and initiates the rendering process of the first view in the UI task.
    taskId: string the id of the task to launch
    stepId: string optional id of a step to be displayed. The first task's step will be displayed if this parameter is null or undefined
    preserveContext: boolean optional parameter to controls if the current UI task context must be preserved. The context is cleared by default if this parameter is null, undefined or ommited.
void
1
/starting a task with id 'MyTask'
2
this.UserInterfaceService.launchTask('MyTask');
3
4
//starting a task with id 'next' and displays the step with id 'step1'
5
this.UserInterfaceService.launchTask('MyTask', 'step1');
6
7
//starting a task with id 'next' , displays the step with id 'step2' and keeps the task context - e.g. the current task context will passed to MyTask
8
this.UserInterfaceService.launchTask('MyTask', 'view2', true);
Copied!
Do not place code after the launchTask method as the navigation transition might cause unpredictable results from the code executed after.

showLoading(): Promise<void>

Description
Parameters
Returns
Example
Displays a preloader panel (infinite loader) on the screen, which blocks the user interface. The preloader is usually used in comnbination with method hideLoading , which hides the preloader.
The showLoading and hideLoading methods are used around logic executions which takes longer.
There are no parameters
void
1
await this.UserInterfaceService.showLoading();
Copied!
Methods showError and showMessage will automatically hide the preloader displayed via showLoading method.

hideLoading(): Promise<void>

Description
Parameters
Returns
Example
Hides the preloader panel (infinite loader) previously displayed with a call to showLoading. There is no side effect if the method is called several times.
There are no parameters
void
1
await this.UserInterfaceService.hideLoading();
Copied!

showMessage(message: string): Promise<void>

Description
Parameters
Returns
Example
Shows modal message box on the screen and hides preloader displayed via showLoading
    message: string the message to be displayed
void
1
await this.UserInterfaceService.showMessage('Opps this is my message');
Copied!

showError(error: string | Error): Promise<void>

Description
Parameters
Returns
Example
Shows error modal message box on the screen and hides preloader displayed via showLoading
    error: string | Error the message or error object to be displayed
void
1
try {
2
throw new Error('ooops this is an error!');
3
}
4
catch(err){
5
this.UserInterfaceService.showError('Opps this is my message');
6
}
Copied!

showToast(toast: string): Promise<void>

Description
Parameters
Returns
Example
Shows a temporary non modal message, which disappears automatically after few seconds
    toast: string the message to be displayed
void
1
2
this.UserInterfaceService.showТoast('My Toast Message');
3
Copied!

getCurrentaskId(): Promise<string>

Description
Parameters
Returns
Example
Returns Id if the task which is currently active. It is supposed to be called in the context of active task and id. It may return undefined in some cases.
string id of existing Task
1
const taskId = await this.UserInterfaceService.getCurrentTaskId();
Copied!

How to use

1
import {View, UserInterfaceService} from '@dms'
2
3
@View
4
export class MyView {
5
6
//declare UserInterfaceServece as view's member
7
//so the framework will inject UserInterfaceServece instance automatically
8
constructor(private UserInterfaceService: UserInterfaceService){
9
10
}
11
12
async resume(){
13
//show toast message to the user
14
this.UserInterfaceService.showToast("View's resume method was caled");
15
}
16
17
myViewMethod(){
18
//navigate to a route with name save
19
this.UserInterfaceService.navigate("save");
20
}
21
}
Copied!
Last modified 1yr ago