Mobile Apps

Tech
niagaraNX
Published in
4 min readJul 13, 2018

Mobile Apps are HTML graphics designed for devices with small screens.

Adding the App object

If you created a station in Coach Ax you will already have the Apps object installed. If so skip this step.

Open the app palette.

Drag and drop the Apps object into the Config object of your station.

Apps Object

When you do this the BoxService will automatically be added to the station Services.

This service is required for the Apps to get data from the station.

Adding Apps

Open the mobile palette.

Expand the NiagaraMobileWebApps object.

By default when you add the alarm, schedule or history app no further setup is required. All of the alarms etc are automatically added to the apps.

The Mobile Px app works in the same way. It finds all mobile graphics in a station automatically.

Adding Apps

Creating Mobile Graphics

To create a mobile graphic it is the same as creating an ordinary graphic, except you need to change the Target Media.

Right-click on the object you want to assign a graphic to and select Views > New View. Give the graphic a name and select Mobile PxMedia as the Target Media.

Create Mobile Graphic

Open the kitPx palette and add graphic components as normal. NB: not all of the components in the kitPx palette will work.

Example Mobile Graphic

Arranging components

In the mobile palette there are two components you can put in a mobile graphic: BasicMobilePane and MobileGridPane.

  • The BasicMobilePane allows you place objects in rows separated by a gap specified in the properties
  • The MobileGridPane allows you place objects in columns separated by a gap specified in the properties
Graphic Components

In the example above we have put a MobileGridPane inside a BasicMobilePane to create a table of points.

To alter the number of columns in a MobileGridPane change the ColumnCount property.

Selecting a home page for users

By default, the user will be presented with a screen that allows them to choose what app to view.

You can select a mobile graphic as a home page for the user and they will see that by default.

Making a nav file

Right-click inside the Files object in the station and select New > NavFile.nav. Double-click the file when it is created.

Create Nav File

Double-click the Home entry and select the folder icon next to the Target Ord box. Select the graphic that you want to be the home page for the user.

Change Home Page

Select File > Save All and then select Save Checked to save the nav file.

Assigning the nav file

Once you have made your nav file open the properties of the mobile user and click the folder icon next to Nav File property.

Select the nav file you created and click Open. Click OK.

Adding Nav File

Now the user will only be able to view the graphics you have added to the nav file.

You can add as many graphics as you need to the nav file by clicking New and selecting the graphics you want the user to be able to view.

Add Graphics To Nav File

--

--