Extensibility Layout XML

Configuration metadata is presented in the form of XML files, which describe:

• The TileContainer, which defines the view hierarchy setup and the navigation pattern
• The tiles, including subviews, controls, and layout parameters
• Data binding information, which describes the model that feeds the tiles
• The default or custom actions to be performed when interacting with a control

A layout XML file typically includes these sections:

<MAF xmlns="http://schemas.sap.com/layout/0.1/maf">
  <!-- Define the binding -->
  <Binding bindingId="Screws" type="collection">
    <P pid="boType" value="ScrewCollection" />
  </Binding>
  <!-- Define the tile container -->
  <TileContainer tileContainerId="Root" type="nav">
    <P pid="isRoot" value="true" />
    <P pid="isHeaderVisible" value="false" />
    	<TileRef ref=”ScrewList” />
  </ TileContainer >

  <!-- Define the tile -->
  <Tile tileId="ScrewList">
    <P pid="title" value="{$_i18n.screwList}" />
    <!-- Define the tiles binding reference -->
    <BindingRef ref="Screws">
      <P pid="useContext" value="true" />
    </BindingRef>
    <!-- Layout Definition -->
    <LinearContainer layout="vertical">
      <P pid="height" value="100%" />
      <P pid="width" value="50%" />
      <P pid="halign" value="left" />
      <P pid="margin_top" value="15pt" />
      <P pid="margin_left" value="40pt" />
      <!-- UILabel -->
      <UIElement type="label">
        <!—label text – the $_i18n. prefix denotes a key to localizable string resource – see also 2.8-->
        <P pid="text" value="{$_i18n.GENERAL_DATA}" />
        <!— Label style as defined in SAPDefaultStyles.xml – see 2.5-->
        <P pid="style" value="CLabelWithLightGreyBackground" />
        <P pid="width" value="85%" />
        <P pid="valign" value="top" />
        <P pid="halign" value="left" />
        <P pid="margin_top" value="10pt" />
        <P pid="margin_left" value="15pt" />
        <P pid="margin_bottom" value="10pt" />
      </UIElement>
      <!-- UIButton -->
      <UIElement type="button">
        <P pid="text" value="{$_i18n.GOTO_MAIN}" />
        <P pid="width" value="85%" />
        <P pid="height" value="36pt" />
        <P pid="margin_bottom" value="7pt" />
        <P pid="style" value="stdButton" />
        <P pid="halign" value="center" />
        <!-- assign events -->
        <Event eventId="onClick">
          <!-- ...and actions -->
          <Action actionId="navigate">
            <P pid="target" value="AppScreen" />
          </Action>
        </Event>
      </UIElement>
      <!-- Further UI definitions - see XSD for all supported UI elements and controls -->
    </LinearContainer>
  </Tile>
</MAF>