DriveWorks Pro 22

Form Navigation

Form Navigation

The Form Navigation designer enables quick creation of multiple input forms.

By using Decisions, you can even selectively decide whether to show specific forms based on values the user has already entered.

A "Details" form is created by default, and automatically linked in to the navigation.

Zoom

The main window can be zoomed in and out by holding the control key on your keyboard, and scroll using the wheel on your mouse.

To reset the zoom to 100% at any time, double click the zoom level box at the top right of the main window.

Create a New Form

To create a new form:

1. Click the Add Form button on the command bar.
2. Give the new form a name.
3. Click OK.

The new form will be created, but isn't linked to the navigation.

Link a Form into the Navigation

To link the new form into the navigation as the first form:

1. Click and hold the left mouse button down on the circle next to the arrow which is pointing into the Details form.
2. Drag the circle across to the new form.
3. Release the left mouse button - the arrow should now point at the new form.
4. Click and hold the left mouse button down on the circle at the bottom of the new form.
5. Drag the circle across to the Details form.
6. Release the left mouse button - you should now have an arrow going from the new form to the Details form.

Creating a Form from a Template

Form Templates provide a starting point to quickly build adaptive forms that respond when viewed on different devices.

To create a Form from a Template:

1. Click the drop down arrow on the Add Form button.
2. Select Add from template.

   

3. Select the required template from the list in the Pick Form Template dialog.

   

4. Enter a name for the Form.
5. Click OK.

The new form will be created, but will not be linked to the navigation.

The template options are:

• Blank Form
• Form Control Toolbox
• Multi Form Layout Bottom Tabs
• Multi Form Layout Bottom Tabs with 3D
• Multi Form Layout Horizontal Tabs
• Multi Form Layout Vertical Tabs
• Multi Form Layout LH Tabs
• Multi Form Layout RH Tabs
• Single Form Layout

Blank Form

The Blank Form template creates a single blank form in exactly the same way as the Add Form button does.

Once the form is created, link it into your navigation as described in Link a Form into the Navigation above.

Form Control Toolbox

This Form Template includes examples of styled Form Controls that you can copy and paste onto your own Forms.

There are four distinct styles that you can choose from to build your user-interface.

All images used to style Form Controls use SVGs. These have been created using a clear, easy-to-read, syntax so that you can modify them to create the user-interface you want.

All shared values including file directories, colors and fonts are linked to Variables so they are easy to update.

Multi Form Layout Bottom Tabs

This template creates a new responsive layout with multiple Forms, with the tabs on the bottom.

Multi Form Layout Bottom Tabs with 3D

This template creates a new responsive layout with multiple Forms, with the tabs on the bottom and 3D Models.

Multi Form Layout Horizontal Tabs

This stylish form has multiple pages on the right hand side for users to navigate through.

Multi Form Layout Vertical Tabs

This stylish form has multiple pages for users to navigate through, with stacked tabs on the left hand side.

Multi Form Layout LH Tabs

This template creates a new responsive layout with multiple Forms, with the tabs on the left.

Multi Form Layout RH Tabs

This template creates a new responsive layout with multiple Forms, with the tabs on the right.

Single Form Layout

This template creates a new responsive layout with a single Form.

The layout adapts to changes in browser width or device orientation using the special variable DWFormContainerWidth.

CPQ-Custom Item Template

This template can be used to add the necessary Variables\Form Controls etc to a configurator that you want to use as a Custom Product inside the DriveWorks CPQ DriveApp.

For more information on adding this template to an existing configurator please see CPQ-CustomItem.

Export Form As Template

User Forms can be exported as a template, for re-using in other Projects.

User Form template creation allows data within a Project to be included in the template.

Multiple User Forms can be included in the template. Use Ctrl + select to choose the required User Forms.

1. Select the User Form(s) to be exported.
2. Click the Export Form As Template button from the command bar.
3. Enter Template Details:
   • Template Name - is the name of the template that will be created.

     The file extension (.drivefort) is not required to be given in the Template Name field.

   • Description - is a brief description of the template. This will be displayed in the Add From template wizard, once the template is installed.
   • Save Location - is the location the template will be created in.
4. Select Project Constants.

   This lists all Constants in the Project. Constants can be selected individually or all at once (right click, Select All).

5. Select Project Variables.

   This lists all Variables in the Project. Variables can be selected individually or all at once (right click, Select All).

6. Select Calculation Tables.

   This lists all Calculation Tables in the Project. Calculation Tables can be selected individually or all at once (right click, Select All).

7. Select Specification Macros.

   This lists all Specification Macros in the Project. Specification Macros can be selected individually or all at once (right click, Select All).

   Conditions placed on Macros will be removed when the template is imported.
8. Select Additional Content.

   This allows any other file to be selected for inclusion in the template.

   Its primary purpose is to allow the inclusion of images, DriveWorks 3D files.

   Do not include Individual Group or Project files, temporary files, other templates, etc.

Install a Form Template

Once the template has been created, it must be installed on each DriveWorks Administrator machine it is required to be added from.

1. Locate the template created above, for example this will be:

   <SaveLocation><TemplateName>.drivefort

2. Double click the file.
3. Follow the steps in the Install wizard.

To add the template to a Project, see Creating a Form from a Template.

DriveWorks Quick Tips
	DriveWorks Quick Tips: Form Templates Form templates are a built-in feature in DriveWorks Solo and DriveWorks Pro that can be used to make your forms look more professional. By customizing the details of the forms, you can make the templates look as if they were designed by your company. To add the template, simply go to the Form Navigation tab and click the small drop-down arrow below the Add Form button. You can customize the details of the form by changing the placeholder pictures to match your brand. Or, in DriveWorks Pro, you can change the constant values.
DriveWorks Quick Tips are a series of 1 minute videos, available on YouTube, that explain specific functionality. View all Quick Tips

Creating a Dialog Form

To create a new Dialog Form:

1. Click the Add Form button on the command bar.
2. Give the new form a name.
3. Click OK.

The new form will be created, as long as the new form remains unconnected to the navigation that sits in between the start and finish flags, the form will be a dialog form.

Dialog forms that are launched from a dialog button or item list control can contain navigation to other dialog forms.

Dialog forms that are launched within the Frame Control cannot contain navigation to other dialog forms within the same frame control.

Creating a new Decision and Linking it into the Navigation

To create a new Decision:

1. Click the Add Decision button on the command bar.
2. Give the new decision a name.
3. Click OK.

The new decision will be created, but isn't linked to the navigation.

Linking a decision to the navigation consists of three parts:

• Setting up a rule which evaluates to either TRUE or FALSE
• Choosing which form to show if the rule evaluates to TRUE
• Choosing which form to show if the rule evaluates to FALSE

To setup the condition:

1. Click the decision to select it.
2. Click the Build button on the command bar.
3. Enter a rule in the rule builder that results in true or false, e.g. IF(SomeControlValue="Blue", TRUE, FALSE) or more succinctly: SomeControlValue=Blue.
4. Click OK to close the rule builder.

To setup the TRUE form, drag the green circle from the decision, over the target form.

To setup the FALSE form, drag the red circle from the decision, over the target form.

DriveWorks Quick Tips
	DriveWorks Quick Tips: Form Decisions Using form decisions allows you to control the flow of a project for your users. In this example, we take on a task that almost everyone has done before, planning for a vacation. We will use DriveWorks to tell us how we should pack for a week in Boston during a chosen season.
DriveWorks Quick Tips are a series of 1 minute videos, available on YouTube, that explain specific functionality. View all Quick Tips

Delete a Form or Decision

To delete a form/decision:

1. Click the form/decision to be deleted so that it becomes selected.
2. Click the Delete button on the command bar.

Rename a Form or Decision

To rename a form/decision:

1. Click the form/decision to be renamed so that it becomes selected.
2. Click the Rename button on the command bar.
3. Enter the new form/decision name.
4. Press Return to confirm the new name.

Aligning Forms and Decisions

You can improve the appearance of your form navigation to make it easier to understand by using the alignment tools on the command bar.

The following alignment tools are available:

• Align Lefts
• Align Vertical Centers
• Align Rights
• Align Horizontal Centers
• Align Middles
• Align Bottoms
• Space Evenly Vertically
• Space Evenly Horizontally

Zooming

You can zoom in the form navigation designer by holding down the Control (CTRL) key on your keyboard, and using the mouse wheel.

To reset the zoom, double click the label at the top right of the navigation designer which tells you the current zoom level.

Working with a Large Navigation

If your form navigation becomes large enough that you can't see the whole navigation on one screen, you can use the Overview tool on the command bar to show a thumbnail of the navigation, and the current scroll position.