Create a Symbol to Fit a Pane of a Known Size

This topic describes the general sequence of steps to create a fixed size symbol designed to fit a ViewApp pane with a known size. This workflow is typical of creating content that will fit exactly within a pane while editing a ViewApp with the ViewApp Editor.

Important:

The size of a symbol in run time is affected by the resolution of the screen that will show the running ViewApp and the specified width and height of the layout pane in which the symbol is placed. Also, the layout Display Mode property includes a set of options that determines how content is resized during run time to fit within the size of a layout pane.

The following procedure describes the steps to create a fixed size symbol that will fit within a pane of a known size. You should create a fixed size symbol whose width and height matches the resolution of the screen profile.You should set the the dimensions of the hosting pane to the same size as the symbol.

To create a fixed size symbol that fits within a pane of a known size

1. Open the ViewApp in the ViewApp Editor that will contain the fixed size symbol.

2. Right-click on the pane that will contain the fixed size symbol and select Create Graphic.

   A dialog box appears requesting a name for the graphic to be created.

3. Assign a name to the graphic.

   The Industrial Graphic Editor opens and the canvas shows the dimensions of the pane that the request to create a graphic was submitted. The Size property is set to Fixed and the FixedWidth and FixedHeight properties show the dimensions of the pane in pixels.

   The white portion of the Industrial Graphic Editor's canvas represents the size of the pane where the request to create a graphic was submitted. Portions of the canvas to the right and bottom of the white area are gray. The gray portion of the canvas is the area outside the vertical and horizontal dimensions of the pane.

   

4. Place graphic elements and symbols to create a symbol.

5. Save and close the symbol from the Industrial Graphic Editor to return to the ViewApp Editor.

   The symbol you created appears in the pane where the request to create a graphic was submitted. The symbol should fit into the pane at the same size as it was designed in the Industrial Graphic Editor.

6. Save the ViewApp and deploy it.

7. Open the deployed ViewApp

   In run time, the ViewApp will show the symbol you created at the same size as it was originally designed in the Graphic and ViewApp editors.

   The rendered symbol shows:

   • The symbol fits in the pane at the same size as it was designed in the Industrial Graphic Editor.

   • The symbol's size does not change in run time.

   • Any blank spaces around the symbol are maintained and appear in the symbol during run time.