Step 1: Skeletal App

Build the application framework using the app studio configurators.

The first step is to create a custom lookup form, and make it available from the navigation bar so that you understand the fundamental design concepts.

It is expected that this step will take no more than 10 minutes of your time.

Open App Studio

Open the administration group in the navigation bar on the left and click on App Studio.

Create a Lookup Form

Create a sparse lookup form, change the panel properties and test how it looks.

Open Forms Configurator

The Forms configurator is located at the bottom of the Data group in App Studio.

When it is clicked, it opens a modal popup dialogue showing a list of all forms in your application.

Add

Click the Add button to create your first lookup form.

The Add Form Properties modal popup dialogue will open.

Add Form Popup

Complete the following fields.

Name

Type a name for your new lookup form.

Purpose

Type a reason why you are creating this form.

Icon

Use the button to the far left to open the Icon Picker to choose a suitable icon for your new form.

Caption

Type the caption you wish to see in your new form.

Apply

Click the Apply button to create your first lookup form.

Design Form

Your new form will now be visible in your list of available forms.

Click the Edit button in the grid row to open up the Edit Form Properties modal popup dialogue again.

Click on the Design button to open the form designer.

Form Designer

The form designer will open with a single empty panel.

Edit Panel

Edit the panel using the right top drop down menu.

The Panel Properties modal popup dialogue will open.

Assign an Icon, and type your Title Text. This will allow you to identify your first form when it is opened.

Click Apply.

Save

Click the top right Save button to persist your form design changes.

Create a Navigation Bar Group

Create your own custom group in the navigation bar.

Open Navigation Bar Configurator

Open App Studio and click the Navigation Bar item.

The Navigation Bar configurator will open.

Add Group

Click the Add Group button.

Add New Special Menu Group

This modal popup dialogue will open.

Enter the name of your new navigation bar group, then click the Save button.

New Navigation Bar Group

The new group is added and selected in the navigation bar tree.

Edit Group Properties

Change the Icon and make sure that this group is Open and Visible.

Apply & Close

Press the Apply & Close button.

The new group should now be visible in the navigation bar

Create a Navigation Bar Group Item

Add a nav bar item linked to your new lookup form.

Open Navigation Bar Configurator

Open like you did here.

Select the Added Group

Select the new group you added previously.

Add Form

Click the Add Form button in the Nav Bar Menu.

The Add New Form Menu Item modal popup dialogue will open.

Form

The form field is a drop down combo containing a list of all forms which have not been added to the navigation bar. This should show the form you added above.

Save

Press the Save button to create the new navigation bar group item.

Edit Properties

The properties will have been inherited from the form you created. You can change any properties here.

Apply & Close

After changing any properties, press the Apply & Close button. The new menu group item should appear in the navigation bar.

Publish and Test

Publish your changes and test your application.

Because you are designing using App Studio, your changes are already published and ready for you to test.

Open Form

Click on the new navigation bar group menu item.

Your new form should be displayed.