5ml User's Guide

5ml User's Guide
Using the Scroll View Widget
The Scroll View widget creates a rectangular window on the page that can hold other page elements, such as Label,
Button, Text, and Image elements. Scroll View elements are useful for displaying other elements that take up a lot of
space, whether due to the size of the element or the number of the elements. It provides additional viewing space as you
can fit more elements or larger elements inside the Scroll View element than would otherwise fit into the space the Scroll
View element takes up on the Canvas. The Scroll View element provides scroll bars that allow the user to scroll vertically
and horizontally to view the other elements within the window. For example, in Figure 13-1 on page 325 you cannot fully
see the two image elements that are contained within the Scroll View element; however, when the mobile user views the
page, they will also see scroll bars that allow them to scroll horizontally and vertically to view all the elements within the
Scroll View window. You can change the appearance of the Scroll View element separately from the other elements and
from the page itself.
To place the widget on a page and create a Scroll View element, drag the widget from the Layout section of the Widgets
pane to the Canvas. You can then resize, align, and arrange the element to fit your page design (for details, see "Working
in the Project Editor" on page 154). You can also associate the Scroll View element with an event and an action to be
performed when the user interacts with the Scroll View element.
After placing the Scroll View element on the page, you can drag widgets from the Widgets pane, or assets from the Assets
pane, into the Scroll View element, as shown in Figure 13-1 on page 325. Each element or asset you add to the Scroll
View element appears as a child to the parent Scroll View element in the Page Outline pane on the lower left side of the
Project Editor.
Figure 13-1: Placing an image inside the Scroll View element
- 325 -