# Types of Screens

The following types of operation method and layout function for screens/contents are available:

Type | Description
Canvas | The screen size is the same as the screen size of the selected display unit. You cannot change the screen size. The size of placed objects appear on the display unit as is. For contents, only the part the same size as the content display unit will be shown, with the upper left as the origin point.
Scroll Canvas | You can scroll the screen using a scroll gesture or switch. Used when the information to be displayed is larger than the display unit screen size, or the screen size is larger than the display area.
Zoom Canvas | By using switches or pinch in/pinch out gestures, you can zoom in and out from screens and content.
View Box | The screen display size automatically adjusts to the available display area, which excludes the header/footer. For content, the display automatically adjusts to the size of the Content Display object.
Grid | Place objects in a tiled pattern. Adjust the size of objects by setting the number of rows and columns in the grid, the height of each row, and the width of each column. The screen display size is automatically adjusted in accordance with the display area excluding the header and footer.
Scroll Grid | Screen that combines features of both the grid and scroll canvas.
Dock Panel | This screen automatically adjusts the object location and size. You can arrange objects so they are placed from the top, bottom, left, or right side of the screen. The last placed object is adjusted to fit into the remaining unused area.
Stack Panel | This screen automatically adjusts the object location and size. Objects are aligned to stack vertically (top to bottom) or horizontally (left to right).
Uniform Grid | This screen automatically adjusts the object location and size. The size of placed objects are all the same. If you set the number of rows and columns, objects are placed in order from the top left, to the right. If rows and columns are not set up, the screen is divided by the number of objects and the size and position of objects are adjusted to fit.

Note:

- You can apply operation/placement functions to a part of the screen/content area. For more information, refer to About Layout Objects.

## Scroll Canvas

The Scroll Canvas is used for content that require a larger content size than the actual display unit screen size.

You can scroll the screen using a scroll gesture or switch.

## Zoom Canvas

With the Zoom Canvas, you can increase/decrease the screen with switches or pinch in/pinch out gestures. Also, you can scroll the screen using a scroll gesture or switch.

Use this function to get a closer view of objects in the screen and to see more of the screen at a reduced size.

## View Box

The View Box automatically adjusts the screen display according to the display area such as the drawing area or Content Display.

In the below movie, you can see the behavior between View Box and Canvas.

## Grid

The Grid places objects in a tiled pattern.

To adjust the size of the objects, set the numbers of rows and columns of the grid, the height of each row and the width of each column. You can also place the objects across multiple cells.

The screen display is automatically adjusted according to the display area such as the drawing area or Content Display. However, the font size of strings in text objects and other objects are not adjusted.

In the below movie, you can see the behavior between Grid and Canvas.

## Scroll Grid

The Scroll Grid has features of both the Grid and Scroll Canvas.

Object placement process is the same as grid. Other than that, it is the same as Scroll Canvas.

## Dock Panel

The Dock Panel stacks and aligns placed objects on the top, bottom, left and right edge of the screen.

The last placed object is adjusted to fit into the remaining unused area.

Note:

- To change the order of stacking, change the placed order of objects in [Object List].
- When setting visibility animation (Visibility) for an object aligned on the screen, the object's alignment can be changed during operation.
  Operation When Visibility Animation is Set Up.

### Drawing Object on the Dock Panel

## Stack Panel

The Stack Panel stacks the objects vertically (up to down) or horizontally (left to right).

If the stacked objects are greater than the screen size, then objects are placed outside the screen area.

You can scroll the screen using a scroll gesture or switch.

Note:

- To change the order of stacking, change the placed order of objects in [Object List].
- When setting visibility animation (Visibility) for an object aligned on the screen, the object's alignment can be changed during operation.
  Operation When Visibility Animation is Set Up.

### Drawing Object on the Stack Panel

## Uniform Grid

Uniform Grid places objects so they are the same size.

If you set the number of rows and columns, objects are placed in order from the top left, to the right. If placed up to the right edge, it is placed on the next row.

If rows and columns are not set up, the screen is divided by the number of objects and the size and position of objects are adjusted to fit.

Note:

- Once the object size has been changed, even if you change the number of rows and columns for the grid, the object size will not automatically adjusted.
- To change the layout position of objects, change the placed order of objects in [Object List].
- When setting visibility animation (Visibility) for an object aligned on the screen, the object's alignment can be changed during operation.
  Operation When Visibility Animation is Set Up.

### Drawing Object on the Uniform Grid