This article outlines how to add a splash screen or disclaimer to a VertiGIS Studio Web app using VertiGIS Studio Workflow. The objective is to display a customized pop-up when the user loads the app. Some examples of what this pop-up might contain are:
- Disclaimers: Outline terms of use to users before they interact with the app. "Accept" and "Decline" options can be included, with additional logic that handles the user's choice.
- Announcements: Highlight new features, share community updates, or communicate scheduled maintenance times.
- Instructions: Provide guidance and tips on using the app to enhance the user experience.
- Branding: Make a strong first impression by including images, icons, and logos specific to your organization.
NOTE: Do not add workflows with forms or alerts to the Application Initializing or Application Initialized events. This will block the app from loading properly and will cause Designer to become unresponsive. Some alternatives are to use the Map Initialized event in the Map component settings, configure Launch Link Workflows, or set an Optional Persistent Workflow in a Workflow component.
Tutorial: Display Terms of Use with "Accept" and "Decline" Buttons
This tutorial will cover how to display a pop-up outlining terms of use when an app is launched. If the user accepts the terms, they are granted access to the app. If the user declines the terms, a prompt comes up, denying them access.
Other types of splash screens and disclaimers can be created by following the same steps, replacing the elements in the Display Form activity with ones that suit the specific use case, and omitting/replacing the logic that handles the "Accept" and "Decline" options.
Design the disclaimer:
- Open VertiGIS Studio Workflow Designer and create a new workflow for VertiGIS Studio Web.
- Drag-and-drop a Display Form activity from the left panel onto the Start box to connect it.
- Double-click the Display Form activity you just added to edit it.
- In the right panel, change the Header element's Title value from "Form Title" to "Terms of Use".
- Drag-and-drop a Text element from the left panel onto the form.
- Click on the Text element you just added to open its properties.
- Enter your terms of use under Description.
- Click on the Button Bar at the bottom of the form to open its properties.
- Change the Label properties on the buttons to "Accept" and "Decline".
- Save the workflow.
Configure the Web app:
- Open your app in VertiGIS Studio Web Designer.
- In the right panel, click the Add Component button.
- Click the Layout tab.
- Drag-and-drop a Dialog component and nest it under your existing Map component.
- Now, click the Other tab.
- Drag-and-drop a Workflow component and nest it under the Dialog component you just added.
- Click on the Workflow component you just added to open its settings.
- Under Optional Persistent Workflow, click the Select Workflow button.
- Choose the workflow you just saved in the previous section.
- Now, go back and click the Dialog component to open its settings.
- Toggle off the Allow Close option.
- Now, go back and click the Map component to open its settings.
- Expand the Events section.
- Click the Select Command button under Map Initialized.
- Choose the Show command.
- In the Component dropdown under the Show command, select the Dialog component you added earlier (you may want to go back rename it if you have more than one "Dialog" component in your app).
- Save the app.
- Try reloading your app to check that a pop-up with the terms of use appears.
Set up the logic:
- Switch back to the workflow you created in Workflow Designer.
- Use the breadcrumbs in the upper left to go back to the Start section if you are not there already.
- Drag-and-drop an If activity from the left panel onto the bottom connector of the Display Form activity.
- Click on the If activity and set its Condition to:
=$form1.result=="submit"
- Drag-and-drop an Alert activity from the left panel onto the False (red "x") connector of the If activity.
- Click on the Alert activity and set its Text to "Please accept the terms of use to view the app."
- Drag a connector from the Alert activity and connect it to the Display Form activity.
- Save the workflow.
- Load your Web app and test that the logic functions correctly.
This article was last updated using VertiGIS Studio Web version 5.29.2 and VertiGIS Studio Workflow version 5.39.1. Images and descriptions may not match in other versions.
Comments
0 comments
Article is closed for comments.