Initializing help system before first use

# View Designer Overview

View Designer is a visual editor available in Xpress Workbench that makes it easy to design and develop the views made available in Xpress Insight apps.Use View Designer to compose a view by dragging interface elements into a symbolic layout and configuring the behavior of those elements with wizards.

View Designer presents a symbolic layout that represents the structure of the final VDL file, it does not behave as a WYSIWYG editor. For advanced tasks you can switch between View Designer and the Code editor to work directly with the underlying markup. Your view can be quickly and easily previewed in Xpress Workbench.

In View Designer, a Palette pane is displayed on the left, the artboard is shown in the central area, and an Attributes pane is on the right.

Views for Xpress Insight apps are composed of various elements: Layouts (such as Section, Row, and Column), Components (such as Tables and Charts), and Logical elements (such as Repeat and Visible). Drag elements from the Palette to the artboard to add them to the view.

Note: Views are regularly automatically saved while they are open in View Designer.

Hovering over the elements on the artboard will highlight their boundaries. Elements can be selected by a left click.

The most commonly used attributes of the currently selected element are displayed in the Attributes pane; The selected element type is shown at the top of the Attributes pane.

Elements placed on the artboard can be moved relative to each other, duplicated, or deleted by utilizing the action toolbar that displays when a placed element is selected. Elements can also be cut, copied, and pasted.

## Using the Palette

Elements are organized on the Palette in groups. Click and drag the element you wish to use onto the artboard. As you pass over placed layout elements, they will change color to indicate if the dragged element can be dropped there.

- blue shading indicates a valid position.
- red shading indicates an invalid position and the element will not be accepted at this position.

The five panes in the Palette and the elements they contain are:

Pane | Element | Description
--- | --- | ---
LAYOUT | Section | Block of page content with padding top and bottom.
Row | Each row is placed under existing content and can hold up to 12 columns.
Column | Divides a row into vertical blocks with a configurable width.
Container | Defines an area in the view and is used to hold other elements.
Include | Include another VDL source file at this point in the page.
COMPONENTS | Table | Placeholder for a table of array entities that are defined in its Table Columns.
Table Column | Defines the array entities that provide the content for a Table.
Chart | Placeholder for a chart that displays model entity data or custom data.
Chart Series | Set of entity or data information supplied to the Chart element.
Index-Filter | Filter an index out of a VDL chart or table.
Form | A container for field elements that controls their behavior.
Field | Used to enter text or values in a Form.
Button | Can be placed anywhere in the view to set a value and run the scenario.
Text | Text in the view can be static or updated using expressions.
Spinner | A spinner image.
Progress Bar | A progress bar that can indicate % complete.
Tableau | An element that contains a Tableau visualization.
LOGIC | If | Use an expression to control whether an element is displayed.
Repeat | Loop around each element in an array, set, element in a JS array, or active scenario.
Repeat Contents | Used to repeat a block of content.
Visible | Use an expression to control the visibility of an element.
Var | Defines a variable name and its value.
Set Sorter | Change the way a set is sorted from the default settings.
HTML | List | A container for List Item elements that populate a bulleted list.
List Item | A container for an item in a list, each list item must be populated with content such as a text component or an html image container.
Image | Defines the source and size of an image in the view.
ACTIONS | Action | The base action used to call other Actions or Javascript functions.
Message | Display a message.
Confirm | Show a confirmation dialog.
Execute Model | Queue the model for execution.
Drawer | Open a drawer page in the current view.
Open View | Navigate to another view.
Manage Scenarios | Open the Scenario Manager.
Job Message | Send a message to an executing scenario.
Cancel Job | Cancel the job for an executing scenario.
Set Var | Set a dynamic variable.
Update Entity | Set the value of a model entity.
Remove Entity | Delete the value of a model entity.
Add Label | Add labels from a label array to data.
Aggregate Data | Aggregate data as an array of numbers, or an array of objects that contain a value property.
Push Array | Push a value to a VDL variable that has been defined as a dynamic array.
Get Entity Data | Fetch data for one or many entities from single or multiple scenarios.
Get Index Set | Return the set names associated with the given entity name
Group Data | Group data by one or more of its keys.
Table Export | Trigger the export function of one or more DataGrid, TreeGrid, or Pivot Table components.
Create Attachment | Create a new attachment.
Edit Attachment | Edit a existing attachment.
Manage Attachment | Manage an attachment.
Edit Attachment Properties | Open a dialog to change the properties of an attachment.
Download Attachment | Download an attachment.
Upload Attachment | Upload an attachment.
Tableau Export | Export the tableau viz in one of the accepted formats.
Tableau Clear Global Filters | Clear Tableau global filters from browser storage and update filters in any active visualizations in the view.

Covered Topics

- Using the View Designer and VDL to Create Custom Views
  The View Designer creates views in VDL, an extensible markup language that is a superset of HTML and follows the same syntax, along with additional elements defined by the VDL language.

Parent Topic Working with Xpress Insight

© 2001-2026 Fair Isaac Corporation. All rights reserved. This documentation is the property of Fair Isaac Corporation (“FICO”). Receipt or possession of this documentation does not convey rights to disclose, reproduce, make derivative works, use, or allow others to use it except solely for internal evaluation purposes to determine whether to purchase a license to the software described in this documentation, or as otherwise set forth in a written software license agreement between you and FICO (or a FICO affiliate). Use of this documentation and the software described in it must conform strictly to the foregoing permitted uses, and no other use is permitted.