OtfGenericScreen

Introduction

The HMI extension (Human Machine Interface) provides access for interacting with the user through the display of graphical screens. To achieve this goal, there are two ways to operate with screens:

1. Basic Screen - A set of basic dialogs providing by the operating systems
2. Custom Screens - Customizable screens that allow arbitrary flexibility

Custom screens only define an interface to a screen. The screen itself is externally created. The layout and functionality of this screen is not defined in the OTX. The interface to the screen is the OTX Screen Signature. A Screen Signature defines all IN-, OUT- and INOUT-Parameters of a screen. The OTX Runtime have to map the Screen Signature Parameters to the proper screen controls. The OTF supports two kinds of Custom Screens:

1. Generic Screen
2. Screen Mapping

Generic Screen

As the name said, Generic Screen is completely data driven. Only the Screen Signature have to define. Via Data Binding mechanism the screen controls will be updated automatically and vice versa. Particular attention is paid to the category attributes of the parameters. Each category is mapped to a Pane inside the Form layout. The default layout can be used or the layout can be adapted. In most cases, the supplied default layout is sufficient. The next section shows how the layout can be changed.

In opposite to the Screen Mapping the layout possibilities of the Generic Screen can be adjusted in a wide range but they are limited. The layout of the Generic Screen is stored in a XML file. The file is located in:

ProjectFolder/HMI/ProjectName.otfSLay

Inside the folder an annotated schema file which describes the layout is also stored.

ProjectFolder/HMI/ScreenLayout.xsd

In the following section the generally layout is descibed.

Screen Layout (Table Layout)

The Screen Layout of Generic Screen is implemented as a so called dynamic Table Layout. The Table Layout arranges its contents in a grid, providing functionality similar to the HTML

element. The Table Layout allows you to place controls in the layout without requiring to precisely specify the position of each individual control. Its cells are arranged in rows and columns, and these can have different sizes. Cells can be merged across rows and columns inside Panes. A Pane can contain any supported control. The picture below shows a sample. The Table Layout also provides a proportional re-sizing capability at run time, so your layout can change smoothly as your form is re-sized.

HMI Generic Screen - Table Layout Sample

The layout in the picture above contains three columns and three rows with described width and height. Six Panes are specified in the layout. For example, Pane 3 spans three cells in the last row and is assigned to the Category "BUTTON", see sample layout file below.

At runtime, the following rules are applied to the layout:

1. A Layout described in layout file can be assigned to one ore more Screen Signatures. If a Screen Signature is not assigned to a layout the default layout is used. The default layout is the first layout with the attribute Default="true". If not exist the first layout is the default layout.
2. The OTX OpenScreen activity opens a window for one Screen Signature. If a Pane refers to that Screen Signature, the window is docked to that pane.
3. Screen Signature Parameters with a specified category will be mapped to the first Pane with the same category. If the category cannot mapped to a Pane, the default pane - with empty category - is used. If no default category exist, the parameter will not mapped.
4. Each mapped Parameter creates a new control. The type of the control depends on the data type of the parameter and/or the category.
5. If more than one parameter is mapped to a Pane the additional parameter can be added in a new row or a new column of that Pane, see GrowStyle

More details about the Table Layout are described in the annotations of the schema file (ScreenLayout.xsd).

Sample Layout file *.otfSLay:

<?xml version="1.0" encoding="UTF-8"?>
<Screen xmlns="http://www.example.org/ScreenLayout" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.example.org/ScreenLayout ScreenLayout.xsd">
  <Display Text="Generic Screen Sample" ShowIcon="true">
    <MinimumSize Width="480" Height="320" />
    <Size Height="480" Width="640" />
  </Display>
  <Layouts>
    <Layout ColumnCount="3" RowCount="3" Default="true">
      <ScreenSignatures>
        <ScreenSignature Name="NewDefaultPackage1.Doc_NewDocument1.ScreenSignatureFrame" />
      </ScreenSignatures>
      <Columns>
        <Column Size="50%" />
        <Column Size="50%" />
        <Column Size="100" />
      </Columns>
      <Rows>
        <Row Size="" />
        <Row Size="100%" />
        <Row Size="" />
      </Rows>
      <Panels>
        <Panel Category="TITLE" Column="0" Row="0" ColumnSpan="2" RowSpan="1">
          <Font Name="Segoe Condensed" Size="24.0" />
          <Dock>Fill</Dock>
        </Panel>
        <Panel BackColor="Gray" Category="" Column="0" Row="1" ColumnSpan="2" RowSpan="1">
          <ScreenSignatures>
            <ScreenSignature Name="NewDefaultPackage1.Doc_NewDocument1.ScreenSignatureContent1" />
            <ScreenSignature Name="NewDefaultPackage1.Doc_NewDocument1.ScreenSignatureContent2" />
          </ScreenSignatures>
          <Dock>Fill</Dock>
        </Panel>
        <Panel Category="MESSAGE" Column="2" Row="0" ColumnSpan="1" RowSpan="2">
          <Title Text="Status">
            <Font Name="Segoe Condensed" Size="18.0" />
          </Title>
          <Dock>Fill</Dock>
        </Panel>
        <Panel Category="BUTTON" Column="0" Row="2" ColumnSpan="3" RowSpan="1" AutoSize="true">
          <Title Text="" />
          <GrowStyle>AddColumns</GrowStyle>
          <Dock>Right</Dock>
        </Panel>
      </Panels>
    </Layout>
    <Layout ColumnCount="1" RowCount="1">
      <ScreenSignatures>
        <ScreenSignature Name="NewDefaultPackage1.Doc_NewDocument1.ScreenSignatureContent1" />
      </ScreenSignatures>
      <Columns>
        <Column Size="100%" />
      </Columns>
      <Rows>
        <Row Size="100%" />
      </Rows>
      <Panels>
        <Panel Category="" Column="0" Row="0" ColumnSpan="1" RowSpan="1">
          <Dock>Fill</Dock>
        </Panel>
      </Panels>
    </Layout>
    <Layout ColumnCount="2" RowCount="1">
      <ScreenSignatures>
        <ScreenSignature Name="NewDefaultPackage1.Doc_NewDocument1.ScreenSignatureContent2" />
      </ScreenSignatures>
      <Columns>
        <Column Size="50%" />
        <Column Size="50%" />
      </Columns>
      <Rows>
        <Row Size="100%" />
      </Rows>
      <Panels>
        <Panel Category="MESSAGE" Column="0" Row="0" ColumnSpan="1" RowSpan="1">
          <Title Text="Message">
            <Font Name="Segoe Condensed" Size="18.0" />
          </Title>
          <Dock>Fill</Dock>
        </Panel>
        <Panel Category="" Column="1" Row="0" ColumnSpan="1" RowSpan="1">
          <Dock>Fill</Dock>
        </Panel>
      </Panels>
    </Layout>
  </Layouts>
</Screen>