ContentPresenterApp runtime examples

During configuration, a ContentPresenterApp is placed in a layout pane. The pane itself becomes the view port of the ContentPresentApp to show the graphics incorporated in the running ViewApp. The following figure shows the display of the ContentPresenterApp during runtime. In this example, graphics are listed in horizontal order and wrap to the next row of the view port when a graphic cannot completely fit within the right view port border.

The size of the view port can be changed by adjusting the size of the layout pane to show more or fewer graphics on each row. Graphics continue to wrap to the next row until they extend beyond the bottom of the view port. Scroll bars appear to move the view port vertically and show the remaining graphics.

This example shows a graphic display when the Fill property is set to Horizontal and the View Mode property is set to WrapContent. Both properties include other options to list graphics vertically and show the graphics in continuous sequential order without wrapping.

The blue background shown in both examples represents a cell within a view port. Each view port cell contains a single graphic. The ContentPresenterApp includes a set of Layout and Size properties that determine the size of the cell, the blank space around the graphic, and the placement of the graphic within the cell.

The figure above shows a fixed size cell with five pixels of padding around the graphic, which is placed at the top center of the cell. All cells in the view port have the same fixed width and height

The Layout and Size properties include other options to scale the size of view port cells to fit the size of graphics and specify the number of cells that appear in each row or column of the view port. The following example shows cells that are scaled to the width and height of the graphics placed within them. The Display Columns property has been set to 4 to always shows four columns of graphics in the view port.

Here is the same example again with the Stretch property enabled. The aspect ratio of a graphic is ignored and the graphic is enlarged in its non-constraining dimension of the cell. For example, the number 8 LED shown above is constrained by its height within its cell. When Stretch is enabled, the graphic width increases to the full width of the cell, as shown below.

See More information about ContentPresenterApp properties for a description of the configuration procedure and how the various property options affect the visual characteristics of graphics within a running ViewApp.