Editing Tile Layouts

The XML text editor displays the Application Configuration Profile tile layouts, and lets you edit the property name-value pairs. You can define the widgets, their layout, and their behavior.

The editor has two tabs:

Source Tab

The Source tab displays the tile layout XML definitions, and offers content assistance for the XML tags and parameter IDs:
Source Tile Layout

The editor is connected with the Outline view, in which you can see the hierarchy of UI elements and containers:
Source Tile Layout Outline View

The editor is connected with the Properties view, which provides an overview of the parameters that can be defined, and allows you to set them. The selections you make in the Project Explorer, Outline view, and the editor are all synchronized with the Properties view, which simplifies common editing tasks.

Visual Tab

On the Visual tab, you can see the configured layout, which is updated as you make edits either on the Source tab or in the Properties view:
Visual Tile Layout

At the top of the editor you can specify how the tile appears. You can set these values:
  • Plaform – either Android or iOS.
  • Orientation – portrait or landscape, and their possible variants (up/down and left/right, respectively).
  • Density – pixel density of the screen. The values in this list depend on the selected platform:
    • For iOS, you can select normal or retina densities.
    • For Android, you can select low, medium, high, or extra-high densities.
  • Screen size – contains well-known devices (for iOS) or screen sizes (for Android). You can also set an arbitrary screen size using the two text boxes to the right of the list, or by dragging the right or bottom edge, or the lower-right corner of the device screen.

    If you select a screen size from the list, you see how the tile would look on a given device. Setting arbitrary dimensions is helpful when the tile is to be used in embedded mode, that is, when the tile is integrated as a container in the application screen.

A visual preview of the layout may not be accurate, because there can be many factors at runtime that affect the appearance of the configured UI elements. Also, a preview does not reflect changes in the style XML.