Interface Components

Interfaces in Appian are made up of components. This page lists all the components and supporting configurations delivered with Appian.

  • If you're looking for information about the PATTERNS tab of the component palette, see Interface Patterns.
  • To understand the Interface design, concepts, and functionality available, see Interface Object.
  • If you're new to Appian, check out Academy Online.

Layouts

Billboard Layout - Displays a background color, image, or video with optional overlay content.

Box Layout - Displays any arrangement of layouts and components within a box on an interface.

Card Layout - Displays any arrangement of layouts and components within a card on an interface. Can be styled or linked.

Columns Layout - Displays any number of columns alongside each other. On narrow screens and mobile devices, columns are stacked.

Dashboard Layout - Displays any arrangement of layouts and components. Use this as the top-level layout for record views and Tempo reports.

Form Layout - Displays any arrangement of layouts and components beneath a title and above buttons. Use this as the top-level layout for start and task forms.

Section Layout - Displays any arrangement of layouts and components beneath a section title on an interface.

Side By Side Layout - Displays components alongside each other.

Layout Elements

Inputs

Barcode - Displays a field that allows entry of a barcode value using a barcode scanner or manual input.

Date - Displays and allows entry of a single date (year, month, day). When the field is editable, users can input dates by typing or by picking from a calendar.

Date and Time - Displays and allows entry of a single date and time (year, month, day, hour, minute, second). When the field is editable, users can input dates by typing or by picking from a calendar and then select the time from a dropdown.

Decimal (Floating Point) - Displays and allows entry of a single decimal number, stored with a floating point representation.

Encrypted Text - Allows entry of a single line of text that is encrypted when saved into a variable.

File Upload - Allows users to upload a file.

Integer - Displays and allows entry of a single integer number.

Paragraph - Displays and allows entry of multiple lines of text.

Text - Displays and allows entry of a single line of text.

Selection

Checkbox By Index - Displays a limited set of choices from which the user may select none, one, or many items and saves the indices of the selected choices.

Checkbox - Displays a limited set of choices from which the user may select none, one, or many items and saves the values of the selected choices.

Dropdown By Index - Displays a limited set of exclusive choices from which the user must select one item and saves the index of the selected choice.

Dropdown - Displays a limited set of exclusive choices from which the user must select one item and saves a value based on the selected choice.

Multiple Dropdown By Index - Displays a long list of choices from which the user may select none, one, or many items and saves the indices of the selected choices.

Multiple Dropdown - Displays a long list of choices from which the user may select none, one, or many items and saves values based on the selected choices.

Radio Button By Index - Displays a limited set of choices from which the user must select one item and saves a value based on the selected choice.

Radio Button - Displays a limited set of choices from which the user must select one item and saves a value based on the selected choice.

Display

Document Viewer - Displays a document from document management on an interface.

Image - Displays an image from document management or the web.

Milestone - Displays the completed, current, and future steps of a process or sequence, such as a user's current step in a wizard or the current state of a business process.

Progress Bar - Displays a completion percentage, such as receiving all the necessary approval tasks, completing a certain number of on-boarding processes, or completing a single process.

Rich Text - Displays text in variety of styles, including bold, italics, underline, links, headers, and numbered and bulleted lists.

Time Display - Displays a single time (hour, minute, second). Does not take an input.

Video - Displays a video from the web

Web Content Field - Displays content from an external source.

Web Video - Displays a video from the web for use in a video field.

Image Types

Rich Text Types

  • Bulleted List - Displays a bulleted list within a rich text component.

  • Header Text - Displays heading-styled text within a rich text component.

  • Inline Image - Displays an image within a rich text component.

  • List Item - Displays a numbered list within a rich text component.

  • Numbered List - Displays a numbered list within a rich text component.

  • Styled Icon - Displays a style icon within a rich text component.

  • Styled Text - Displays styled text within a rich text component.

Action

Button Array Layout - Displays a list of buttons in the order they are specified.

Button Layout - Displays a list of buttons grouped by prominence. Use this layout in cases where prominence needs to be explicitly specified.

Link - Display one or more links of any type. Link types serve two main purposes: to navigate to objects, such as tasks and records, or to perform actions, such as downloading documents or starting processes.

Button Types

  • Button - Displays a button that can conditionally be used to submit a form.

Grids

Editable Grid - Arranges interface components in a tabular layout to provide quick inline editing of fields.

Paging Grid - Displays read-only text, links, and images in a grid that supports selecting, sorting, and paging.

Editable Grid Elements

Paging Grid Elements

Charts

Bar Chart - Displays numerical data as horizontal bars. Use a bar chart to display several values at the same point in time.

Column Chart - Displays numerical data as vertical bars. Use a column chart to graphically display data that changes over time.

Line Chart - Displays a series of numerical data as points connected by lines. Use a line chart to visualize trends of data that changes over time.

Pie Chart - Represents numerical data as slices of a single circle. Use a pie chart to graphically display parts of a whole.

Chart Data

  • Chart Reference Line - Contains the reference line value for each threshold that is defined on a column, bar, or line chart.

  • Chart Series - Defines a series of data for a bar, column, line, or pie chart.

Pickers

Custom Picker - Displays an autocompleting input for the selection of one or more items from an arbitrary data set.

Document Picker - Displays an autocompleting input for the selection of one or more documents.

Document and Folder Picker - Displays an autocompleting input for the selection of one or more documents or folders.

Folder Picker - Displays an autocompleting input for selecting one or more folders.

Group Picker - Displays an autocompleting input for selecting one or more groups.

Record Picker - Displays an autocompleting input for the selection of one or more records, filtered by a single record type. Suggestions and picker tokens use the title of the record.

User Picker - Displays an autocompleting input for the selection of one or more users.

User and Group Picker - Displays an autocompleting input for selecting one or more users or groups.

Browsers

Document Browser - Displays the contents of a folder and allows users to navigate through a series of folders to find and download documents.

Document and Folder Browser - Displays the contents of a folder and allows users to navigate through a series of folders to find and select a folder or document.

Folder Browser - Displays the contents of a folder and allows users to navigate through a series of folders to find and select a folder.

Group Browser - Displays group membership structure in columns. Users can navigate through the structure and select a single user.

Hierarchy Browser (Columns) - Displays hierarchical data in the form of drillable columns with selectable cells.

Hierarchy Browser (Tree) - Displays hierarchical data in the form of a drillable tree.

Org Chart - Displays the organizational structure of users within Appian based on the users' Supervisor field values.

User Browser - Displays group membership structure in columns. Users can navigate through the structure and select a single user.

User and Group Browser - Displays group membership structure in columns. Users can navigate through the structure and select a single user or group.

Hierarchy Browser Elements

  • Hierarchy Browser Node (Columns) - Returns a Hierarchy Browser Field Columns Node, used in the Node Configurations parameter of the Columns Browser to determine how items in the hierarchy are displayed.

  • Hierarchy Browser Node (Tree) - Returns a Tree Node, used in the Node Configurations parameter of the Tree Browser Component to determine how items in the hierarchy are displayed.

FEEDBACK