Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Page in draft: this should be the concept page for screen layouts

Overview

This section is about how you create a screen with all the bits you need using the components and templates from the palette.

Other aspects covered in other topics are

  • Setting up Data ??Links
  • Compiling views ??Links
  • Details about Styles.??Links

    There are several stages to designing an application, as outlined in Designing Applications. This topic explains how to lay out the screens using the components provided in the palette.

    Child links??


    Panel
    borderColor#00374F
    titleColorwhite
    titleBGColor#00374F
    borderStylesolid
    titleSections on this page

    Table of Contents
    maxLevel3
    indent12px
    stylenone


    Usually an application screen has some combination of

    • multiple data records, for example grid, chart, graph or in cards.
    • selected data records, for example a set of fields (form) or card
    • fields for user interaction and their lables
    • buttons
    • menus and navigation

    When it comes to creating actions, you can wire actionflows to different components on the screen

    • button - on-click - action, such as update or delete
    • default double-click action on a data view, such as a grid. such as open recorcd.

    When you open an existing screen, it is locked by default. This means the screen cannot be edited, for example by selecting or moving componentss. In design mode, right click on the screen area to unlock it. The previous locked status is remembered when switching back to design mode from app mode. To test buttons and actions that you have configured for a screen, you must switch to 

    Insert excerpt
    _app_mode
    _app_mode
    nopaneltrue
    .

    Chart buttons

    Charts provides the standard grid icons.

    They also provides the following icons:

    Refresh the chart.

    Select an existing (or predefined) Filter or create, delete and modify Filters. This causes the chart to refresh and display only those entries which match the selected Filter.

    Select an existing (or predefined) multi-column Sort Order or create, delete and modify Sort Orders. Note that data is ordered across all records which are implied by the Filter, not just the current page of data.

    Opens the download data form allowing the user to export just the selected items or all data on the chart as either an Excel file, a CSV (comma separated) file or as an HTML document.

    Display the number of records in the data, and the number of records currently being displayed.

    Grid Context Menus

    Right-click on a data grid to open the context menu. The options available depend on whether you right-click in the header row or in a grid row.

    Header Context Menu

    Sort AscendingSort the data in this grid by this column in ascending order (0 to 9, A to Z)
    Sort DescendingSort the data in this grid by this column in descending order (9 to 0, Z to A)
    Freeze ColumnFreeze the column to keep it visible when you scroll through the other columns.
    Unfreeze all ColumnsUnfreeze all the columns so that the will all move if the grid is scrolled.
    Set Flex ColumnFlex columns adjust their size automatically to fit the space.
    Hide this Column

    Use these options to expand or collapse grid columns in a screen.

    Hidden columns do not appear in the grid. To re-show a hidden column, right-click any grid row and select Show Attributes for View <viewName> → Hide this column


    Show Hidden Columns

    Row Context Menu

    Show Stream Item DetailsOpens a window with all the information contained in that grid row
    Show Attributes for View <viewName>

    Opens a list of all of the attributes (column headers) for this stream view.  Attributes formatted in italics are present in the stream but are hidden in the grid.

    To change whether an attribute is hidden or visible, right-click the attribute and select Show this column or Hide this column.


    Links

    Panel
    borderColor#00374F
    titleColorwhite
    titleBGColor#00374F
    borderStylesolid
    titleOther pages in this topic

    Child pages (Children Display)